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.
中文简介正在准备中。当前显示原文说明。
Creates a Stitch Design System from a DESIGN.md that was already uploaded with stitch-mcp-upload-design-md. Second half of a two-step pair — the upload must happen first.
中文简介正在准备中。当前显示原文说明。
查看安装方法安装前可以查看交给 AI 代理的指令内容。
Turns an uploaded DESIGN.md into a real Stitch Design System and displays it in the UI. This is step two of a pair — stitch-mcp-upload-design-md must have run first, because this tool consumes the screen instance that upload created.
Calling it without a prior upload fails: there's no screen instance to point at.
Only use this skill when the user explicitly mentions "Stitch" in their request. Never trigger Stitch operations silently during regular conversation.
stitch-mcp-upload-design-md returns — always, as a pairYou need two values from the upload step. If you didn't capture them, fetch them now with get_project (note: this one takes the projects/ prefix):
{
"name": "get_project",
"arguments": { "name": "projects/3780309359108792857" }
}
Take the newest entry in screenInstances and read off both id and sourceScreen.
{
"name": "create_design_system_from_design_md",
"arguments": {
"projectId": "3780309359108792857",
"selectedScreenInstance": {
"id": "a1b2c3d4e5f6",
"sourceScreen": "projects/3780309359108792857/screens/98b50e2ddc9943efb387052637738f61"
},
"deviceType": "DESKTOP"
}
}
Three different ID formats in one call. This is the single easiest place to get it wrong:
| Field | Format | Example |
|---|---|---|
projectId | numeric only, no prefix | 3780309359108792857 |
selectedScreenInstance.id | screen instance id — not the source screen id | a1b2c3d4e5f6 |
selectedScreenInstance.sourceScreen | full resource path, both prefixes | projects/.../screens/... |
deviceType is optional: MOBILE, DESKTOP, TABLET, or AGNOSTIC. Omit it and Stitch decides.
On success you get back a design system with an asset id in assets/NUMERIC_ID form. Store both forms: apply_design_system wants the bare numeric part, generate_screen_from_text's designSystem param wants the full assets/NUMERIC_ID string.
Announce it:
"Design system created from your DESIGN.md (asset
15996705518239280238). Want me to apply it to existing screens, or use it for the next generation?"
stitch-mcp-apply-design-systemdesignSystem: "assets/15996705518239280238" to generate_screen_from_text| Tool | ID format required |
|---|---|
create_design_system_from_design_md | Numeric projectId + the screen-instance pair above |
upload_design_md | Numeric only: 3780309359108792857 |
apply_design_system | Numeric assetId, no assets/ prefix |
generate_screen_from_text | designSystem does take the assets/ prefix |
get_project | Full path: projects/3780309359108792857 |
Yes —
apply_design_systemwants the bare asset id whilegenerate_screen_from_textwants it prefixed. Same identifier, two formats, depending on which tool you hand it to.
stitch-mcp-upload-design-md, alwaysstitch-mcp-apply-design-system or a generation callstitch-mcp-list-design-systems还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
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.
中文简介正在准备中。当前显示原文说明。
Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions. Always respects prefers-reduced-motion.
中文简介正在准备中。当前显示原文说明。
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.
中文简介正在准备中。当前显示原文说明。
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.
中文简介正在准备中。当前显示原文说明。
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.
中文简介正在准备中。当前显示原文说明。
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.
中文简介正在准备中。当前显示原文说明。