HyperDesign
UI/UX Design
Free
HyperDesign turns any website URL into a reusable design system. It captures the page with a stealth browser, analyses the screenshot and scraped content with Claude Opus, and emits a DESIGN.md of colors, typography, spacing, and radius that drops straight into Claude Code, Cursor, or any AI coding agent.
Key features
- Stealth viewport screenshots via Hyperbrowser and Playwright
- Structured page scraping to markdown alongside the screenshot
- Combined visual and structural analysis with Claude Opus
- Outputs a single DESIGN.md following the open DESIGN.md standard
- YAML frontmatter carrying the extracted design metadata
- In-app preview panel for colors, type scale, spacing, and radius
Pros
- MIT licensed and fully self-hostable
- Output is agent-ready context rather than a screenshot dump
- Removes the manual CSS audit when matching a reference site
Cons
- No hosted version — you run it locally
- Requires your own Hyperbrowser and Anthropic API keys
- Extraction quality depends on a single viewport capture
design-systemdesign-tokensweb-scrapingclaudeagent-contextopen-source
Try HyperDesign on AIniverse
Read full reviews, see what other builders think, save to your stack.
Open in App · Visit site