UI Scanner — Website Design System Extraction#

Automatically crawl a website URL and reverse-engineer its visual design system, outputting a structured design specification document.

Workflow#

text

URL input → page crawl → visual element classification → style extraction → structured output → write to file

Routing Table#

ScenarioReference FileQuick start, minimal workflowquick-start.mdOutput format, YAML template, field descriptionsoutput-template.mdDetailed explanation of 6 analysis dimensionsanalysis-dimensions.mdExtraction methods, CSS sources, inference rulesextraction-methods.mdCommon mistakes and anti-patternsanti-patterns.md

Output#

Results are written to {domain}_design.md using standard YAML frontmatter + Markdown structure. See output-template.md for the complete template and field descriptions.