Design system extraction
Your codebase has a design system.
You just never saw it.
Desy Guard scans your repo, extracts the tokens and components you actually ship, cleans what is left over, documents all of it, exports it to your AI agents, and governs every new component through a structured review before it enters the design system.
Free, no credit card. First result in 5 minutes.
$ desy scan --repo acme/web-app
✓1 284files parsed
✓312tokens extracted
✓47components detected
✓11export formats generated
Token breakdown
- 21
- Parsers, from CSS to SwiftUI
- 11
- Export formats for AI agents
- 5 min
- To your first Health Score
- 0
- Config lines to write
Proof
21 parsers. Your DS in 5 minutes.
Not a theoretical audit. The actual output of a Desy Guard scan on a 1 284 file Next.js repository.
Extracted tokens
- --color-brand-600#1F6FEB
- --color-accent-400#12B886
- --color-danger-500#E5484D
- --color-surface-2#F4F5F7
- SP--space-416px
- RD--radius-lg12px
- TY--font-displayInter Tight
+ 305 more tokens
Detected components
- Button142 uses
- Card87 uses
- Input63 uses
- Badge41 uses
- Dialog22 uses
- Tabs14 uses
DS health
Health score
- Tokens
- 312
- Components
- 47
- Duplicates
- 38
- Frameworks
- 6
The problem
In 2026 your agents write code faster than you do. But they write #3B82F6 instead of --color-primary, and margin: 24px instead of --spacing-6. Because nobody ever told them your design system exists.
- 01
The DS lives in Figma, not in the repo
Agents do not read Figma. They read files. Until your tokens sit in their context, they improvise.
- 02
The documentation is six months behind
The doc was written once, at launch. The code has moved fourteen times since. The doc has not.
- 03
Every agent invents its own conventions
Cursor names a variable one way, Copilot another, Claude a third. Three vocabularies in a single codebase.
- 04
Nobody sees the drift until the refactor
Hardcoded values pile up quietly. You find them the day a single color has to change in 214 places.
The pipeline
Four steps, one source of truth.
You connect a source. Desy Guard handles extraction, cleanup, documentation and distribution.
- 01
Connect your source
GitHub, Figma, a CSS file or an archive. No configuration, no file to write.
github.com/acme/web-app
- 02
Multi-parser extraction
21 parsers walk your code, from CSS and Tailwind to React, Vue, Svelte, Astro, Angular, SwiftUI and Compose.
21 parsers · 1 284 files
- 03
Clean DS and documentation
Duplicates merge, orphan values surface, and an LLM documents every token and every component.
design-system.md · 312 tokens
- 04
Export to your agents
11 generated, versioned files. You commit them, your agents read them, they stop inventing.
.cursorrules · CLAUDE.md · tokens.json
AI exports
Eleven files. Your agent stops guessing.
One export per tool, generated from the same cleaned design system. Cursor, Claude, Copilot and Windsurf first.
1# Design system, generated by Desy Guard2# acme/web-app @ main · 312 tokens · 47 components34## Color5Always resolve colors to a CSS variable.6--color-brand-600 #1F6FEB primary actions7--color-accent-400 #12B886 success states8--color-danger-500 #E5484D destructive910## Spacing114px scale, --space-1 to --space-12. No inline px.1213## Components14Button has 142 usages. Import it, never re-implement it.15Never write a raw hex value in a component.
Surface detection
One repo. Multiple products. Zero confusion.
Desy detects when your codebase spans several product surfaces (landing site, SaaS, mobile app) and audits each one independently. Compare their coherence, surface drift between products, and choose which design to standardize on.
- Automatic surface detection from route groups, monorepo layout, and platform files.
- Each surface gets its own token list, component list, and health score.
- A coherence matrix shows how aligned your product surfaces are to each other.
Detected surfaces
Cross-surface coherence
Monitoring
Your tokens drift. Desy tells you.
Every scan compares the current state to your reference. A changed color, an improvised spacing, a duplicated component: you get the alert before it ships.
3 tokens changed since the last scan.
- --color-brand-600#1F6FEB#2563EB
- --space-416px15px
- --radius-lg12px10px
Remapping
Your codebase remaps to your tokens.
Desy Guard builds the substitution map between your hardcoded values and your clean tokens, then applies it file by file in a pull request you can actually review.
.button--primary {- background: #1F6FEB;+ background: var(--color-brand-600);- padding: 16px 24px;+ padding: var(--space-4) var(--space-6);- border-radius: 12px;+ border-radius: var(--radius-lg);}
Component governance
Only Desy does thisA new component appeared.
Who decides if it belongs?
When a developer ships a component outside the design system, Desy Guard doesn’t just alert you. It opens a structured review: approve it into the DS, reject it with a cleanup recommendation, or defer the decision. No other tool does this.
MegaButton
Detected outside the design system. No prior documentation.
Approve
- Component added to the design system
- LLM generates full documentation
- Component count incremented
- Jira ticket created if connected
Reject
- Drift alert resolved
- Rejection recommendation created
- Suggested fix attached
- Submitter notified
Defer
- Stays visible in the review queue
- Optional reminder date
- Decidable at any time
No other tool in the market makes this possible.
Pricing
A one-off audit, or continuous governance.
2 months free on annual
Free
To see the real state of your codebase.
€0forever
- 1 project
- 1 full analysis
- Health Score and token preview
Pro
Freelancers and design system consultants.
€79/month
billed monthly
- 3 projects, 2 members
- 5 analyses/month
- Shareable client portal
- All 11 AI exports, CLI and MCP access
Team
Growing product teams with multiple design systems.
€249/month
billed monthly
- 10 projects, 5 members
- 20 analyses/month
- Weekly monitoring + Jira integration
- All 11 AI exports, CLI and MCP access
Agency
Agencies running several client codebases.
€799/month
billed monthly
- 20 projects, 10 members
- 100 analyses/month
- Daily monitoring + Jira integration
- White-label reporting
Enterprise
Large organizations and enterprises.
On request
- Unlimited projects and members
- Auto-remapping pull requests (coming soon)
- SSO / SAML and audit logs
- Dedicated SLA, onboarding and data sovereignty
Need a one-time audit without committing to a subscription?
Get the One-Shot Pass: $49Prices exclude VAT. Change plan or cancel at any time.
Analyze your codebase.
See your design system as it really is.
One source, five minutes, one Health Score. You will see exactly how many tokens live in your code, and how many hardcoded values contradict them.
No credit card. 5 minutes to your Health Score.