Air. Midnight sky through glass sculpture.
- SaaS
- Dark theme
- 6 colors
- 4 typefaces
Air uses a dark, atmospheric canvas with full-bleed cloud photography and sculptural glass-like 3D forms as its primary visual mode. The type system is the brand: a single sans-serif at moderate weights carries everything from nav to body, while compressed and cursive display cuts break in for emphasis — one italic word ("AI") in cursive sets a confident, slightly playful tone against the otherwise restrained UI. Components are lightweight — minimal elevation, thin borders, small radii, and near-transparent surfaces — letting the imagery carry emotion while the interface stays functional and fast.
Air design system
Accent2
Heading text on dark backgrounds — the only chromatic text color, a desaturated steel blue that reads as cool and atmospheric rather than vivid
Blue text accent for links, tags, and emphasized short phrases. Do not promote it to the primary CTA color
Neutrals4
Navigation borders, link underlines, deepest contrast layer on white surfaces
Body and heading text on light surfaces, button borders on light cards
Card surfaces, input fields, subtle button fills on dark backgrounds — the off-white layer that sits above the dark canvas
Primary text on dark surfaces, nav button borders, hairline strokes, card surfaces over photographic backgrounds
Try a pairing
Pick any two colors from the palette to check whether text stays readable on top.
Aa
Whiteout on Twilight Blue
6.37 : 1 contrast
- Body textPasses AA 4.5
- Large textPasses AA 3
- StrictFails AAA 7
