stitch-mcp-list-design-systems
Stitch MCP — List Design Systems
Lists all available Stitch Design Systems. These are reusable theme configurations (colors, fonts, roundness, saturation) that can be applied to screens for visual consistency across a project.
Critical prerequisite
Only use this skill when the user explicitly mentions "Stitch".
When to use
- Before applying a design system — need to find the
assetId - User asks "what design systems do I have?"
- The orchestrator checks for existing design systems during project setup (Step 4b)
- Before creating a new design system — check if one already exists
Call the MCP tool
{
"name": "list_design_systems",
"arguments": {
"projectId": "3780309359108792857"
}
}
projectId — numeric ID only, optional
✅ "3780309359108792857"
❌ "projects/3780309359108792857"
If omitted, returns all design systems across all projects.
Output schema
Returns an array of Asset objects:
{
"assets": [
{
"name": "assets/ds_abc123",
"displayName": "SaaS Dashboard Theme",
"designSystem": {
"theme": {
"colorMode": "LIGHT",
"font": "DM_SANS",
"roundness": "ROUND_EIGHT",
"saturation": 3,
"customColor": "#6366F1",
"backgroundLight": "#FFFFFF",
"backgroundDark": "#18181B"
},
"designTokens": "...",
"styleGuidelines": "..."
}
}
]
}
After listing
Present as a readable table:
| # | Name | Font | Color | Mode | Asset ID |
|---|---|---|---|---|---|
| 1 | SaaS Dashboard Theme | DM Sans | #6366F1 | Light | ds_abc123 |
Then offer:
- "Apply one of these to a screen?" →
stitch-mcp-apply-design-system - "Update an existing design system?" →
stitch-mcp-update-design-system - "Create a new design system?" →
stitch-mcp-create-design-system
Extract the name field from each asset — this is the assetId needed for apply_design_system.
More from gabelul/stitch-kit
stitch-mcp-get-screen
Retrieves full details of a specific Stitch screen — HTML download URL, screenshot URL, dimensions. This is the final step in design retrieval before code conversion.
35stitch-setup
Step-by-step installer for the stitch-kit plugin and Stitch MCP server. Use this when setting up the plugin for the first time, diagnosing connection issues, or helping a new user get Stitch running in Claude Code or Codex CLI.
34stitch-react-components
Converts Stitch designs into modular Vite + React components — TypeScript, theme-mapped Tailwind, dark mode via CSS variables, and clean component architecture. Use this for Vite/React apps without App Router. For Next.js 15 App Router, use stitch-nextjs-components instead.
24stitch-ui-prompt-architect
Builds Stitch-ready prompts via two paths — Path A enhances vague ideas into polished prompts, Path B merges a Design Spec JSON + user request into a structured [Context] [Layout] [Components] prompt.
23stitch-ideate
Conversational design ideation agent that researches trends, explores visual directions, and refines ideas through adaptive questioning — then produces a rich PRD document and auto-generates Stitch screens. Your design buddy that thinks deeply before designing.
23stitch-mcp-create-design-system
Creates a reusable Stitch Design System from theme tokens — colors, fonts, roundness, saturation. Can be applied to future screens for visual consistency.
23