StealIt
Google Labs OfficialClaude skill for design

Stitch Code To Design

stitch::code-to-design

Convert frontend code (Vite, React, Angular, Vue, etc.) to a Stitch Design by chaining static HTML extraction, design system extraction, and file upload. **ALWAYS** use this skill when the user's intent is to move existing web apps or React/Angular/Vue components into Stitch (e.g., requests to "save", "migrate", or "upload"). You must use this skill even for simple "save" operations, as it is the only way to ensure the design system is extracted and assets are properly linked.

Install

Run this in your project folder. It works with Claude Code, Cursor, Codex and dozens of other agents.

$ npx skills add google-labs-code/stitch-skills --skill stitch::code-to-design

Needs Node.js. Add -g to install for every project, or -a claude-code to skip the agent picker.

How to use Stitch Code To Design

Once it's installed, Claude reads this skill on its own whenever a request matches what it's for, so you don't have to mention it by name.

It contains no scripts, only instructions and reference files, so it can't run code on its own.

What the instructions cover

  1. 1Workflow

Section headings from the skill's SKILL.md file.

What's inside · 1 files

  • SKILL.md

More from Google Labs

See all →

Design MD

Analyze Stitch projects and synthesize a semantic design system into DESIGN.md files

Design & UIGoogle Labs8.7k

Enhance Prompt

Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better…

AI & AgentsGoogle Labs8.7k

React Vite Dashboard

Convert Stitch designs into production React + Vite dashboards with TanStack Query, accessible tokens from DESIGN.md, and Web3-ready patterns (ethers/viem).

FrontendGoogle Labs8.7k

Remotion

Generate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays

Video & MotionGoogle Labs8.7k

More Claude skills for design

See all →

Frontend DesignTop pick

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't…

Design & UIAnthropic187k

UI UX Pro MaxTop pick

UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing, or fixing interfaces, including pages, components, design…

Design & UINextLevelBuilder145k

Taste SkillTop pick

tasteskill v2, the anti-slop frontend skill. Art direction for websites, distilled from a study of 247 curated gallery sites (One Page Love, Awwwards Sites of the Day). Deals…

Design & UILeon110k

Impeccable

Use when the user wants to design, redesign, shape, critique, audit, polish, simplify, harden, animate, or otherwise improve a frontend interface: websites, landing pages…

Design & UIPaul Bakaus103k