From stitch-kit
Applies Stitch Design Systems to project screens, updating colors, fonts, and roundness for visual theme consistency. Use after creating design systems when user mentions Stitch.
How this skill is triggered — by the user, by Claude, or both
Slash command
/stitch-kit:stitch-mcp-apply-design-systemThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
Applies a previously created Stitch Design System to one or more screens. This updates the screen's visual theme (colors, font, roundness) to match the design system, ensuring visual consistency across a project.
Applies a previously created Stitch Design System to one or more screens. This updates the screen's visual theme (colors, font, roundness) to match the design system, ensuring visual consistency across a project.
Only use this skill when the user explicitly mentions "Stitch".
You must have:
projectId (numeric)screenId values (numeric)assetId from a design system (from list_design_systems or create_design_system){
"name": "apply_design_system",
"arguments": {
"projectId": "3780309359108792857",
"selectedScreenIds": ["88805abc123def456", "99906xyz789ghi012"],
"assetId": "ds_abc123"
}
}
projectId — numeric ID only, no prefix✅ "3780309359108792857"
❌ "projects/3780309359108792857"
selectedScreenIds — array of numeric screen IDs✅ ["88805abc123def456"]
❌ ["projects/123/screens/88805abc123def456"]
All selected screens will have the design system applied.
assetId — the design system identifierThe name field from a design system asset, or just the ID portion:
✅ "ds_abc123"
Get this from:
stitch-mcp-list-design-systems → extract from the name field of each assetstitch-mcp-create-design-system → returned in the response name fieldReturns updated screen data reflecting the applied design system.
stitch-mcp-get-screen for each screenIdstitch-mcp-edit-screensapply_design_system callnpx claudepluginhub gabelul/stitch-kit --plugin stitch-kitEdits existing Stitch UI screens via text prompts to refine colors, layout, content, or style without regenerating from scratch. Ideal for iterative design changes after initial generation.
Analyzes Stitch projects using MCP tools to generate DESIGN.md files, semantically documenting design systems (themes, colors, shapes) for consistent UI generation.
Creates Stitch UI screens, design systems, variants, and prototypes from briefs, mockups, or product context. Exports Tailwind HTML, screenshots, and local code artifacts. Use for screen exploration, editing Stitch projects, or multi-screen prototypes.