stitch::code-to-design

To migrate React components into a design system, this skill extracts static HTML, generates design tokens, and uploads assets to Stitch. This process transforms your frontend codebase into a cohesive design artifact while maintaining style coherence.

Converting HTML and CSS into design tokens is done by sequencing HTML extraction and design-system generation. It analyzes your existing web app styles and automatically generates a DESIGN.md file to establish a consistent design system.

Yes, you can use existing web app code to generate a Stitch design. By providing your built frontend project directory, the orchestrator extracts static HTML and assets, linking them directly into your Stitch project workspace.

Yes, you need a built frontend project directory to extract design assets. The process requires coordinating inputs like your source directory and projectId to accurately extract HTML and upload linked assets to the design platform.

Migrating a React component library requires coordinating multiple sub-skills because the workflow sequences HTML extraction, design-system generation, and asset upload. Managing these steps ensures consistent design tokens and properly linked assets in the final output.