Turn a site's visual style into a design guide.
What it does
Creates a reusable design-system document from a website, HTML file, or screenshot.
When to use it
Use when documenting an existing site's visual language, extracting brand guidelines, or establishing design consistency across pages.
How to use it
Give it a website, HTML file, or screenshot to analyse; it writes a design-system document into DESIGN.md.
What you provide
- a website URL or design source
Uses
What you need · 2
The document-writing step instructs the agent to follow the DESIGN.md template in design-loop's references/site-template.md.
The Google Stitch source option uses STITCH_API_KEY set in the environment together with the installed SDK; other source options do not require it.
Access · 2
This skill
the source website
Reads the source website
Google Stitch
Reads your Google Stitch projects