stitch::code-to-design

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

Convert frontend code into a Stitch Design by chaining extraction and upload skills.

  • Moves existing web apps or React/Angular/Vue components into Stitch for iteration.
  • Depends on stitch tools, Bash, Read, Write, and web_fetch for processing.
  • Triggers on save, migrate, or upload requests, then runs three extraction skills sequentially.
  • Produces a self-contained HTML file and DESIGN.md, then uploads both to Stitch.

SKILL.md

.github/skills/stitch::code-to-designView on GitHub ↗

No skill content available yet.

More from google-labs-code/stitch-skills

SkillDescription
design-mdAnalyze Stitch projects and synthesize a semantic design system into DESIGN.md files
enhance-promptTransforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results.
react-vite-dashboardConvert Stitch designs into production React + Vite dashboards with TanStack Query, accessible tokens from DESIGN.md, and Web3-ready patterns (ethers/viem).
remotionGenerate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays
shadcn-uiExpert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization, and best practices.
site-mdAnalyze a project description or site requirements and synthesize a project constitution into SITE.md for the Stitch Build Loop
stitch-loopTeaches agents to iteratively build websites using Stitch with an autonomous baton-passing loop pattern
stitch::extract-design-md>-
stitch::extract-static-html>-
stitch::generate-design>-