stitch-a11y
Audits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes, keyboard navigation, focus…
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.
$ npx -y skills add gabelul/stitch-kit --skill stitch-mcp-list-projects --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
/stitch-mcp-list-projectsContext preview
The summary Claude sees to decide when to auto-load this skill.
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.
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.
Repo: gabelul/stitch-kit
Audits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes, keyboard navigation, focus…
Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions. Always respects…
Analyzes a Stitch project's screens and synthesizes a natural-language DESIGN.md — visual atmosphere, color palette with hex values, typography rules, and…
Extracts a Stitch design and generates production code artifacts — CSS custom properties with dark mode tokens, a Tailwind v4 @theme block, and a semantic…
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…
Conversational design ideation agent that researches trends, explores visual directions, and refines ideas through adaptive questioning — then produces a rich…