Color Palette
Colors
Typography
Fonts
Roboto
body
300
system
Work Sans
heading
500
self-hosted
Roboto
heading
300
system
sans-serif
body
300
600
700
system
body
The quick brown fox
15pxh1
The quick brown fox
11pxh2
The quick brown fox
40pxh3
The quick brown fox
30pxh4
The quick brown fox
18pxComponents
Design System
Zustimmung
outline
0px#334797
Alle zulassen
primary
3.51562px#334797#ffffff
Anpassen
secondary
3.51562px#ffffff#334797
dropdown
box-shadowrgba(0, 0, 0, 0) 0px 4px 28px 0px
modal
box-shadowrgba(0, 0, 0, 0.3) 0px 30px 70px 0px
Voice & Tone
Personality
Visual Energy
5/10
Design Era
contemporary
Emotional Tone
professional
Target Audience
general audience
Design Assets
Visual Elements
svg170×170
svg170×170
svg170×170
png119×43
png119×72
png75×75
DESIGN.md not yet generated for this brand.
How to use this file
1. Save this file as DESIGN.md in your project root (sibling to README.md).
2. AI agents that read project files (Claude Code, Cursor, v0, Lovable, Bolt, Windsurf) will discover it automatically.
3. Validate or export tokens with the official CLI:
npx @google/design.md lint DESIGN.md npx @google/design.md export --format tailwind DESIGN.md
Developer Access
cURL
# Fetch the full brand kit
curl https://extractvibe.com/api/brand/cursor.ai \
-H "x-api-key: ev_your_key"
# Export as CSS variables
curl https://extractvibe.com/api/extract/JOB_ID/export/css \
-H "x-api-key: ev_your_key"
# Export as Tailwind config
curl https://extractvibe.com/api/extract/JOB_ID/export/tailwind \
-H "x-api-key: ev_your_key"Extract your own brand kit
Get colors, fonts, voice, and personality from any website in seconds. Open source.