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.
npx claudepluginhub gabelul/stitch-kit --plugin stitch-kitThis skill is limited to using the following tools:
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.
Edits 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 via MCP tools to synthesize semantic design systems into DESIGN.md, extracting style guides and design tokens for colors, typography, spacing from screens.
Enhances UI/UX prompts, synthesizes .stitch/DESIGN.md systems, generates/edits high-fidelity HTML screens via Stitch MCP for consistent designs.
Share bugs, ideas, or general feedback.
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 call