Stitch Design

by @google-labs-code · plugin · 6 skills

Stitch Design skills from google-labs-code/stitch-skills.

Install the whole plugin (CLI)

npx skillmds add google-labs-code/stitch-code-to-design
npx skillmds add google-labs-code/stitch-generate-design
npx skillmds add google-labs-code/stitch-upload-to-stitch
npx skillmds add google-labs-code/stitch-extract-design-md
npx skillmds add google-labs-code/stitch-extract-static-html
npx skillmds add google-labs-code/stitch-manage-design-system

⬇ Download

Skills in this plugin

▌
stitch-code-to-design · google-labs-code
Convert frontend code (Vite, React, etc.) into a Stitch Design by extracting static HTML, analyzing the design system, and uploading to Stitch.

6.4k
repo stars
▌
stitch-generate-design · google-labs-code bundle
Generate new design screens from text prompts or images, edit existing screens, and create design variants using Stitch MCP.

6.4k
repo stars
▌
stitch-upload-to-stitch · google-labs-code bundle
Upload local assets (images, mockups, extracted HTML, design markdown) to a Stitch project, bypassing MCP tool base64 token limits.

6.4k
repo stars
▌
stitch-extract-design-md · google-labs-code bundle
Reverse-engineer a design system from frontend source code by analyzing component files, stylesheets, Tailwind configs, theme definitions, and design tokens to produce a comprehensive DESIGN.md document.

6.4k
repo stars
▌
stitch-extract-static-html · google-labs-code bundle
Extract self-contained static HTML from a built web application or React components by inlining CSS and images.

6.4k
repo stars
▌
stitch-manage-design-system · google-labs-code bundle
Manage design systems in Stitch using MCP tools, including retrieval of assets, creating or updating design systems, and applying them to screens.

6.4k
repo stars