Live brand kit examples — all features unlocked
Full brand analysis for all 8 example brands — color palettes, typography, Brand Vibe Radar, Clone-to-Code Generator, and all 10 export formats. Paste any of these URLs on the homepage to get free full access.
Color Palette
Primary
#533AFD
Secondary
#061B31
Neutral
#50617A
Dark
#273951
Accent
#FF6118
Surface
#E5EDF5
Success
#81B81A
Info
#000EFF
Typography
Primary Typeface
sohne-var
The quick brown fox jumps over the lazy dog.
ABCDEFGHIJKLMNOPQRSTUVWXYZ · 0123456789
Body Fallback
Inter
The quick brown fox jumps over the lazy dog.
ABCDEFGHIJKLMNOPQRSTUVWXYZ · 0123456789
Spacing & Shape
Spacing Scale
--spacing-*Border Radius
--radius-*Brand Vibe
Design intent scored across 6 dimensions — computed from extracted colors, typography, and spacing tokens.
Clone-to-Code Generator
Brand-ready component code injected with your extracted design tokens. Preview live, copy instantly.
Injected Brand Tokens
--primary
#543afd
--secondary
#061b32
--accent
#ff621a
--text
#533afd
--muted
#283a53
--radius
8px
--shadow
0 1px 3px rgba(0,0,0,0.1)…
--font
sohne-var
Code Exports
:root {
--color-primary: #533afd;
--color-secondary: #061b31;
--color-accent: #ff6118;
--color-surface: #e5edf5;
--font-primary: 'sohne-var', sans-serif;
}All Export Formats
Get the real downloads
Paste stripe.com into StyleExtract to get all 10 export files for free. This is a bypass brand — full access is automatic.
Extract Stripe →PDF Brand Book
16-page whitelabeled guide
.css
CSS Variables
:root custom properties
.js
Tailwind v3 Config
tailwind.config.js
.css
Tailwind v4 @theme
CSS-native config
.css
Shadcn UI Theme
Light + dark mode
.json
Figma Tokens
Tokens Studio format
.md
STYLE.md
AI coding agent file
.txt
.cursorrules
Cursor IDE context
.docx
Brand DOCX
Branded Word doc
.pptx
Brand PPTX
Brand presentation
