Design system · v1
The style behind the software.
Every screen you see on VOLUME uses the tokens below. Nothing free-form. Nothing accidental. This page is the reference — for the team, for anyone auditing, for anyone building on top.
01 · Palette
Ten tokens, no more.
Canvas
bg-canvas
Marketing background
Bone
bg-bone
Primary text on dark
Cream
bg-cream
Secondary text
Ash
bg-ash
Body copy
Mute
bg-mute
Metadata + labels
Line
bg-line
Hairline dividers
Sun
bg-sun
Accent + CTA
Card
bg-card
Elevated surfaces
App bg
bg-app-bg
Dashboard background
App ink
bg-app-ink
Dashboard text
02 · Type
Three faces, one voice.
Display
Instrument Serif
Walkable space.
Body
DM Sans
Film. Upload. Ship a tour.
Meta / marker
JetBrains Mono
01 · Proof · v1.4.0
03 · Motion
Slow reveals. Cinematic ease.
Reveal
ease [0.22, 1, 0.36, 1] · 0.9s
Hero fade + Ken Burns
opacity 1.6s · scale 14s
Count-up
easeOutCubic · IntersectionObserver-gated
0
04 · Controls
Magnetic. Weighted.
05 · Voice
Declarative. Specific.
Say
Walkable listings from one phone video. Twenty minutes, end to end. Yours to keep.
Don't say
Revolutionary AI-powered immersive experiences that transform property marketing.
Prefer
Numbers over adjectives ("$79 vs $75/mo") · Verbs over nouns ("Ship" not "Deployment") · Italic connective on the second phrase.
The product is quiet. Let the interface be quiet too.