The design system
A field guide for making things that feel unmistakable.
This is the Digital Discovery Group design system — a small, opinionated set of choices about colour, type, form, and tone. Every surface we ship leans on it. If it's not in here, we don't use it.
Built to be understood in an afternoon and applied by anyone — designer, developer, founder. The rules are few; the personality is specific.
The principles.
Editorial over corporate.
Every layout should feel like a spread, not a landing page. Generous margins, confident typography, deliberate whitespace. Nothing arrives by accident.
Warm, not loud.
The Miami palette is saturated but restrained. One accent moment per view, not five. Gradients are seasoning, never the meal.
Two voices, one mind.
A tall thin Didone for poster moments. A humanist grotesk for everything functional. The italic serif is the flourish — used sparingly, always earning its place.
Motion with reason.
Ambient drift, never twitch. Every animation either reveals structure, rewards attention, or signals state. If it doesn't, delete it.
The chapters.
work.
Take the system with you.
Tokens, logos, and specimens — ready to drop into code, a deck, or a brief.
How it's set.
Headlines & display in Italiana. Flourishes in Instrument Serif italic. UI in Geist. Handwriting in Caveat. No system fonts — every surface serves the voice.
Sunset & pacific.
Warm paper and twilight navy as the two canvases. Coral, peach, amber lean warm. Teal, periwinkle, mauve lean cool. Dark mode swaps ink for chalk — accents unchanged.
Eight points.
All spacing is a multiple of 8. Radii are 2 / 4 / 8 / 16px or pill. Shadows are three steps — soft / card / lift. No exceptions without a reason.