stitch-design — Skills — getagentictools

What it does

Project Scope: Maintain the current projectId. Use listprojects if unknown.

Design System: Check for .stitch/DESIGN.md. If it exists, incorporate its tokens (colors, typography). If not, suggest the generate-design-md workflow.

Vague: "Make a nice header"

Professional: "Sticky navigation bar with glassmorphism effect and centered logo"

Platform: [Web/Mobile], [Desktop/Mobile]-first

Palette: [Primary Name] (#hex for role), [Secondary Name] (#hex for role)

Styles: [Roundness description], [Shadow/Elevation style]

Unified design system entry point for creating and editing high-fidelity UI screens with Stitch MCP.

Source

Repository: https://github.com/google-labs-code/stitch-skills

stitch-design FAQ

What does the stitch-design skill do?

Unified entry point for Stitch design work. Handles prompt enhancement (UI/UX keywords, atmosphere), design system synthesis (.stitch/DESIGN.md), and high-fidelity screen generation/editing via Stitch MCP. Project Scope: Maintain the current projectId. Use listprojects if unknown. Design System: Check for .stitch/DESIGN.md. If it exists, incorporate its tokens (colors, typography). If not, suggest the generate-design-md workflow.

How do I install stitch-design?

Run: npx -y skills add https://github.com/google-labs-code/stitch-skills --skill stitch-design --agent claude-code — the source lives at github.com/google-labs-code/stitch-skills.

Maintain stitch-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![stitch-design on getagentictools](https://getagentictools.com/badge/skills/google-labs-code-stitch-skills-stitch-design.svg)](https://getagentictools.com/skills/google-labs-code-stitch-skills-stitch-design?ref=badge)

npx agentictools info skills/google-labs-code-stitch-skills-stitch-design

The second line is the CLI lookup for this page — handy in READMEs and docs.