Lists all Stitch Design Systems, optionally filtered by project. Returns asset names needed for apply and update operations.
The English summary is being prepared. Showing the original description.
See how to installReview the instructions the agent will receive before you install.
Lists all available Stitch Design Systems. These are reusable theme configurations (colors, fonts, roundness) that can be applied to screens for visual consistency across a project.
Only use this skill when the user explicitly mentions "Stitch".
assetId{
"name": "list_design_systems",
"arguments": {
"projectId": "3780309359108792857"
}
}
projectId — numeric ID only, optional✅ "3780309359108792857"
❌ "projects/3780309359108792857"
If omitted, returns all design systems across all projects.
Returns an array of Asset objects:
{
"assets": [
{
"name": "assets/15996705518239280238",
"displayName": "SaaS Dashboard Theme",
"designSystem": {
"theme": {
"colorMode": "LIGHT",
"font": "DM_SANS",
"roundness": "ROUND_EIGHT",
"customColor": "#6366F1",
"backgroundLight": "#FFFFFF",
"backgroundDark": "#18181B"
}
}
}
]
}
Present as a readable table:
| # | Name | Font | Color | Mode | Asset ID |
|---|---|---|---|---|---|
| 1 | SaaS Dashboard Theme | DM Sans | #6366F1 | Light | 15996705518239280238 |
Then offer:
stitch-mcp-apply-design-systemstitch-mcp-update-design-systemstitch-mcp-create-design-systemExtract the name field from each asset (assets/15996...). It's used two different ways depending on the next call:
apply_design_system's assetId — strip the assets/ prefix, pass the bare numeric idupdate_design_system's designSystem.name — pass name as returned, with the prefixNo reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Audits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes, keyboard navigation, focus management, and screen reader support.
The English summary is being prepared. Showing the original description.
Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions. Always respects prefers-reduced-motion.
The English summary is being prepared. Showing the original description.
Analyzes a Stitch project's screens and synthesizes a natural-language DESIGN.md — visual atmosphere, color palette with hex values, typography rules, and Stitch-ready prompt snippets. Use this before stitch-loop or any multi-page build to establish design consistency.
The English summary is being prepared. Showing the original description.
Extracts a Stitch design and generates production code artifacts — CSS custom properties with dark mode tokens, a Tailwind v4 @theme block, and a semantic design system document. Run this before framework conversion skills.
The English summary is being prepared. Showing the original description.
Converts a Stitch screen, a local HTML file, or a URL into clean, platform-agnostic HTML5 + CSS — semantic markup, CSS custom properties for theming, dark mode via prefers-color-scheme, mobile-first responsive, zero framework dependencies. Works in browsers, WebViews, Capacitor, and Ionic. Only the Stitch route needs an API key.
The English summary is being prepared. Showing the original description.
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.
The English summary is being prepared. Showing the original description.