Design Catcher
Overview
Capture any website's design system and export DESIGN.md, STRUCTURE.md, and UI-KIT.md for AI agents.
Design Catcher captures any website's visual design system and exports a portable DESIGN.md specification for AI coding agents. HOW IT WORKS • Visit any website you want to replicate • Open the Design Catcher side panel • Capture extracts HTML, CSS, computed styles, and CSS variables • Your LLM synthesizes a structured DESIGN.md with design tokens • Copy or download and use with Cursor, Claude Code, Codex, or any AI agent KEY FEATURES • Deterministic extraction of colors, typography, spacing, radius, and components • Bring your own API key — OpenAI, Claude (Anthropic), or NVIDIA NIM • Optional viewport screenshot for vision-capable models • Portable DESIGN.md format with token refs like {colors.primary} • No backend — API keys stored locally in chrome.storage.local • Open source under MIT license Perfect for developers who want to replicate a site's design language in their codebase without manually documenting every style.
0 out of 5No ratings
Details
- Version0.1.2
- UpdatedJune 9, 2026
- Size134KiB
- LanguagesEnglish
- Developer
Email
developer.0208@gmail.com - Non-traderThis developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.
Privacy
Design Catcher has disclosed the following information regarding the collection and usage of your data. More detailed information can be found in the developer's privacy policy.
Design Catcher handles the following:
This developer declares that your data is
- Not being sold to third parties, outside of the approved use cases
- Not being used or transferred for purposes that are unrelated to the item's core functionality
- Not being used or transferred to determine creditworthiness or for lending purposes
Support
For help with questions, suggestions, or problems, visit the developer's support site