stitch-kit

In the author's own words, from each skill's SKILL.md — showing the first 30 of 36 files.

• stitch-a11y

  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.

  skills/stitch-a11y/SKILL.md on GitHub (opens in a new tab)

• stitch-animate

  Adds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions. Always respects prefers-reduced-motion.

  skills/stitch-animate/SKILL.md on GitHub (opens in a new tab)

• stitch-design-md

  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.

  skills/stitch-design-md/SKILL.md on GitHub (opens in a new tab)

• stitch-design-system

  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.

  skills/stitch-design-system/SKILL.md on GitHub (opens in a new tab)

• stitch-html-components

  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.

  skills/stitch-html-components/SKILL.md on GitHub (opens in a new tab)

• stitch-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.

  skills/stitch-ideate/SKILL.md on GitHub (opens in a new tab)

• stitch-loop

  Iteratively build multi-page websites using Stitch. Reads next-prompt.md (the baton), generates the next page with Stitch MCP, integrates it into the site, then updates next-prompt.md to continue the loop. Works with stitch-design-md and stitch-ui-prompt-architect for consistent multi-page output.

  skills/stitch-loop/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-apply-design-system

  Applies a Stitch Design System to existing screens — updates their colors, fonts, and roundness to match the design system's theme. Requires an assetId from list or create operations.

  skills/stitch-mcp-apply-design-system/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-create-design-system-from-design-md

  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.

  skills/stitch-mcp-create-design-system-from-design-md/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-create-design-system

  Creates a reusable Stitch Design System from theme tokens — colors, fonts, roundness. Can be applied to future screens for visual consistency.

  skills/stitch-mcp-create-design-system/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-create-project

  Creates a new Stitch project container (a design workspace). Call this when starting a new design session to get a projectId for screen generation.

  skills/stitch-mcp-create-project/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-delete-project

  Permanently deletes a Stitch project and all its screens. Destructive — requires explicit user confirmation before calling.

  skills/stitch-mcp-delete-project/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-edit-screens

  Edits existing Stitch screens with text prompts — the iteration tool. Change colors, layout, content, or style without regenerating from scratch. Supports refinement loops via output_components suggestions.

  skills/stitch-mcp-edit-screens/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-generate-screen-from-text

  Generates a high-fidelity UI screen or wireframe from a text prompt using Stitch. This is the core text-to-UI generation tool — the heart of the Stitch workflow.

  skills/stitch-mcp-generate-screen-from-text/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-generate-variants

  Generates design variants of existing Stitch screens using the native variant API. Explore alternative layouts, color schemes, fonts, or content with configurable creativity levels.

  skills/stitch-mcp-generate-variants/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-get-project

  Retrieves metadata for a specific Stitch project — title, theme, create/update time. Use to inspect a project before generating new screens. Do NOT use this if you already have a screenId — use stitch-mcp-get-screen instead.

  skills/stitch-mcp-get-project/SKILL.md on GitHub (opens in a new tab)

• 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.

  skills/stitch-mcp-get-screen/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-list-design-systems

  Lists all Stitch Design Systems, optionally filtered by project. Returns asset names needed for apply and update operations.

  skills/stitch-mcp-list-design-systems/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-list-projects

  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.

  skills/stitch-mcp-list-projects/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-list-screens

  Lists all screens in a Stitch project. Use this after generate_screen_from_text to find the screenId of the newly generated screen, then call stitch-mcp-get-screen to retrieve it.

  skills/stitch-mcp-list-screens/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-update-design-system

  Updates an existing Stitch Design System's theme, tokens, or guidelines. Requires the asset name from create or list operations.

  skills/stitch-mcp-update-design-system/SKILL.md on GitHub (opens in a new tab)

• stitch-mcp-upload-design-md

  Uploads a DESIGN.md file to a Stitch project as the first half of turning it into a Stitch Design System. Always paired with stitch-mcp-create-design-system-from-design-md, which must be called immediately after.

  skills/stitch-mcp-upload-design-md/SKILL.md on GitHub (opens in a new tab)

• stitch-nextjs-components

  Converts a Stitch screen, a local HTML file, or a URL into production-ready Next.js 15 App Router components — Server vs Client split, dark mode via CSS variables, TypeScript strict, ARIA, and responsive mobile-first layout. Only the Stitch route needs an API key.

  skills/stitch-nextjs-components/SKILL.md on GitHub (opens in a new tab)

• stitch-orchestrator

  Master entry point for all Stitch design workflows. Routes from user request → design spec → prompt assembly → screen generation → iteration (edit, variants, design systems) → design system extraction → framework conversion (Next.js, Svelte, HTML, React Native, or SwiftUI) → optional quality pass.

  skills/stitch-orchestrator/SKILL.md on GitHub (opens in a new tab)

• stitch-react-components

  Converts a Stitch screen, a local HTML file, or a URL 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. Only the Stitch route needs an API key.

  skills/stitch-react-components/SKILL.md on GitHub (opens in a new tab)

• stitch-react-native-components

  Converts a Stitch mobile screen, a local HTML file, or a URL into React Native / Expo components — TypeScript, StyleSheet, Expo Router, dark mode via useColorScheme, and proper touch targets. Cross-platform iOS and Android. Only the Stitch route needs an API key.

  skills/stitch-react-native-components/SKILL.md on GitHub (opens in a new tab)

• stitch-remotion

  Generates walkthrough videos from Stitch projects using Remotion. Downloads screenshots from Stitch screens, builds a Remotion composition with transitions and text overlays, and renders to MP4. Use with stitch-mcp-list-screens and stitch-mcp-get-screen for screen discovery.

  skills/stitch-remotion/SKILL.md on GitHub (opens in a new tab)

• stitch-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.

  skills/stitch-setup/SKILL.md on GitHub (opens in a new tab)

• stitch-shadcn-ui

  Integrates shadcn/ui into React apps generated from Stitch designs. Component discovery and installation, token alignment with Stitch design system, customization patterns, and blocks (auth, dashboard, sidebar). Use with stitch-react-components or stitch-nextjs-components.

  skills/stitch-shadcn-ui/SKILL.md on GitHub (opens in a new tab)

• stitch-skill-creator

  Meta-skill for creating new stitch-kit skills. Enforces naming conventions, SKILL.md structure, examples format, and the Design-First SOP. Use when adding new framework support, a new domain-specific prompt architect, or any new capability to the stitch-kit plugin.

  skills/stitch-skill-creator/SKILL.md on GitHub (opens in a new tab)

No skill matches that filter.

Similar skills

• ctf-skillsby ljagiello Agent skills for solving CTF challenges - web exploitation, binary pwn, crypto, reverse engineering, forensics, OSINT, and more 3.5k stars · 11 skills
• open-stepsby kharmanskyi Plain-language agent skills for Claude Code, Codex, Cursor and Gemini CLI: honest session reports, straight verdicts, steps you can follow.… 1.4k stars · 8 skills
• ponytailby DietrichGebert Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote. 164k stars · 6 skills
• marketingskillsby coreyhaines31 Marketing skills for Claude Code and AI agents. CRO, copywriting, SEO, analytics, and growth engineering. 54.9k stars · 30 skills
• awesome-agent-skillsby VoltAgent A curated collection of 1000+ agent skills from official dev teams and the community, compatible with Claude Code, Codex, Gemini CLI, Curso… 35.8k stars
• planning-with-filesby OthmanAdi Persistent file-based planning for AI coding agents and long-running tasks. Crash-proof markdown plans, session recovery after /clear and c… 27.5k stars · 6 skills