Skip to main content
What it contains
Static-analysis CLI that extracts design systems from URLs, repositories, or local code and writes agent-ready design artifacts/skills.
Typical uses
Reverse-engineer an existing visual language before implementing or restyling a frontend; package findings for Claude/coding agents.
Why people choose it
Inference: saves manual inventory of colors, typography, spacing, motion, and components without requiring an AI API.
Last meaningful updateUnknown
Production readinessdevelopment
Classification
Subject domains
frontend designdesign systems
Task categories
frontend designdesign systems
Project phases
designimplementationreview
Secondary types
skill collection
Select when
- Need a design system extracted from an existing site/codebase
Do not select when
- Need original product UX strategy
- Backend-only task
Implementation complexitymedium
Routing heuristic 82.0%
Security boundary clarity
3/5 First-party routing documentation
5/5 Strengths
- No AI/API key for core static analysis
- Multiple source modes
Poor-fit scenarios
- Need original product UX strategy
- Backend-only task
Limitations
- Browser mode adds dependencies
src/modes/url.ts
Extract design tokens/cues from a URL.
static analysis
src/modes/ultra.ts
Use browser-backed inspection/screenshots.
browser renderingscreenshots
src/modes/dir.ts
Analyze local code.
local analysis
src/modes/repo.ts
Analyze repository source.
repository analysis
src/writers/skill.ts
Write extracted knowledge as an agent skill.
SKILL.md generation
FrameworksNone documented
Operating systemsNone documented
Installation methodsnpx/npm
Required credentialsNone documented
External servicesNone documented
Major dependenciesNone documented
Compatibility notes
None documented.
One-sentence semantic summary
Static-analysis CLI that extracts design systems from URLs, repositories, or local code and writes agent-ready design artifacts/skills.
Capability keywords
design extractionURL analysisrepository analysisskill packaging
User intent phrases
- Need a design system extracted from an existing site/codebase
Negative match phrases
- Need original product UX strategy
- Backend-only task
Differentiators
- No AI/API key for core static analysis
- Multiple source modes
Security considerations
None documented.
Privacy considerations
None documented.
Uncertainty
Unresolved items
None documented.
Inference notes
None documented.
Repository usage guidance
installation summarynpx/npm
basic usage summaryReverse-engineer an existing visual language before implementing or restyling a frontend; package findings for Claude/coding agents.
documented entry pointsCLI
key configuration filesNone documented
important directoriessrc/modes/, src/extractors/, src/writers/
documentation pathsREADME.md
example pathsNone documented
Relationships
No explicit repository relationships indexed.
Recommended combinations
Frontend quality stack high
Each repository covers a distinct layer; avoid combining tools that duplicate lifecycle ownership.
Order of operations
- Extract incumbent design system
- Make extracted tokens/design docs authoritative
- Run Impeccable for scoped design/audit
- Use taste skill only where it does not conflict
Routing rules
rule_001: Need a design system extracted from an existing site/codebase P999
Rationale
Static-analysis CLI that extracts design systems from URLs, repositories, or local code and writes agent-ready design artifacts/skills.
Required conditions
None documented.
Preferred
amaancoderx/npxskillui
Fallback
None