stitch-skills: a set by google-labs-code

design-md official google-labs-code skill Extracts screens and styles from Google Stitch via MCP to synthesize a semantic design system into a DESIGN.md file. Claude Code CX Codex Cursor +1 64,700installs enhance-prompt official google-labs-code skill Turns rough UI concepts into detailed, structured prompts for Google Stitch. Pulls tokens from DESIGN.md and formats colors, sections, and component keywords. Claude Code CX Codex Cursor +1 58,300installs stitch-loop official google-labs-code skill Guides agents through iterative website creation with Stitch MCP. The agent reads the baton file, generates UI, integrates the page, and prepares tasks for the next run. Claude Code CX Codex Cursor +1 56,300installs shadcn-ui official google-labs-code skill Helps discover, add, and customize shadcn/ui components in React projects. Useful when building interfaces with Tailwind CSS. Claude Code CX Codex Cursor +1 53,400installs stitch::react-components official google-labs-code skill Turns Stitch designs into modular Vite and React components. Can also sync existing components with updated Stitch designs. Claude Code CX Codex Cursor +1 50,400installs remotion official google-labs-code skill Turns Stitch project screens into a Remotion walkthrough with transitions, zoom effects, and text overlays. Useful for presenting an interface screen by screen. Claude Code CX Codex Cursor +1 41,300installs taste-design official google-labs-code skill Generates agent-ready DESIGN.md files for Google Stitch screens. It sets strict rules for typography, palettes, and spring motion to avoid generic UI tropes. Claude Code CX Codex Cursor +1 20,100installs stitch::generate-design official google-labs-code skill Turns a text prompt or an image into a finished UI screen through Stitch MCP, then edits it with targeted prompts. Claude Code CX Codex Cursor +1 10,700installs stitch::extract-design-md official google-labs-code skill Extracts a complete DESIGN.md design system directly from frontend source files without building or rendering the project. Useful for styling audits and Stitch exports. Claude Code CX Codex Cursor +1 10,500installs stitch::manage-design-system official google-labs-code skill Manages Stitch design systems through MCP tools: retrieves screen data, creates project-level tokens, and applies them to selected screens. Claude Code CX Codex Cursor +1 10,200installs stitch::code-to-design official google-labs-code skill Moves an existing frontend into Stitch by extracting standalone HTML and a design system, then uploading both to a project. Useful when bringing pages or components into Stitch for further work. Claude Code CX Codex Cursor +1 10,100installs stitch::upload-to-stitch official google-labs-code skill Uploads local images, mockups, extracted HTML, and design markdown to a Stitch project over HTTP, bypassing MCP base64 token limits. Claude Code CX Codex Cursor +1 9,900installs stitch::extract-static-html official google-labs-code skill This skill saves a rendered app page as a standalone HTML file with CSS and images embedded. Use it to share a static view or prepare a page for Stitch. Claude Code CX Codex Cursor +1 9,900installs react-vite-dashboard official google-labs-code skill This skill converts Stitch designs into production React and Vite dashboards. It maps tokens from DESIGN.md and integrates async data fetching with TanStack Query. Claude Code CX Codex Cursor +1 5,400installs site-md official google-labs-code skill Generates a .stitch/SITE.md constitution file from requirements or project briefs for the Stitch Build Loop. Claude Code CX Codex Cursor +1 3,600installs