stitch-a11y
Audits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes,…
Lists all Stitch projects accessible to the user. Use this to find an existing project ID before resuming work or generating new screens in an existing project.
Claude Code
$ npx -y skills add gabelul/stitch-kit --skill stitch-mcp-list-projects --agent claude-code
Codex
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a codex -y
Cursor
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a cursor -y
Gemini CLI
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a gemini-cli -y
GitHub Copilot
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a github-copilot -y
OpenCode
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a opencode -y
Windsurf
$ npx skills add gabelul/stitch-kit --skill stitch-mcp-list-projects -a windsurf -y
name: stitch-mcp-list-projects description: Lists all Stitch projects accessible to the user. Use this to find an existing project ID before resuming work or generating new screens in an existing project. allowed-tools: - "stitch*:*"
Lists Stitch projects available to the user. Use this when you need to find an existing projectId rather than creating a new project.
**Only use this skill when the user explicitly mentions "Stitch".**
**To list owned projects (default):**
{
"name": "list_projects",
"arguments": {
"filter": "view=owned"
}
}**To list projects shared with the user:**
{
"name": "list_projects",
"arguments": {
"filter": "view=shared"
}
}**To list all accessible projects (owned + shared):**
{
"name": "list_projects",
"arguments": {}
}{
"projects": [
{
"name": "projects/3780309359108792857",
"title": "Analytics Dashboard",
"updateTime": "2024-11-15T10:30:00Z"
}
]
}1. Present the project list to the user with titles and last-updated timestamps 2. Ask which project to work in (if multiple) 3. Extract the numeric ID from the chosen `name` field: `projects/ID` → `ID` 4. Store both the full name and numeric ID for subsequent calls
Your coding agent writes decent code and designs terrible UI. stitch-kit fixes the second half — it wires agents into Google Stitch (text prompts → genuinely beautiful screens) and teaches them to drive it properly.
Audits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes,…
Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte…
Analyzes a Stitch project's screens and synthesizes a natural-language DESIGN.md — visual atmosphere, color palette with hex…
Extracts a Stitch design and generates production code artifacts — CSS custom properties with dark mode tokens, a Tailwind v4…
Converts a Stitch screen, a local HTML file, or a URL into clean, platform-agnostic HTML5 + CSS — semantic markup, CSS custom…
Conversational design ideation agent that researches trends, explores visual directions, and refines ideas through adaptive…
You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…
Ask which skill or flow fits your situation. A router over the skills in this repo.