3.1
Primary typeface
Alix Sans is the brand typeface. Reproduce it only from the supplied master font files. Never substitute a lookalike.
Alix Sans · Regular 400AaBbCc& ? ! 0 1 2 3
The typeface.
Alix Sans carries brand communication. Geist Mono is the utility face for data and specification. Regular 400 is the display and editorial voice; Bold 700 is reserved for emphasis at small sizes.
- Typeface
- Alix Sans
- Weights
- Regular 400 · Bold 700
- Monospace
- Geist Mono
- Case
- Sentence case
3.2
One display weight
Build hierarchy from size, space, and colour, not weight. The display scale stays at Regular 400, so large Alix type reads light and editorial. Reserve Bold 700 for emphasis at small sizes, never headlines.
Outsized outcomessupported by a quieter second lineSize + colour · all 400
Outsized outcomesa heavier second line
3.3
Display scale
Four fixed display sizes for headlines and section titles, all at weight 400. Reach for the named size; applications decide how they adapt to the canvas.
Outsized outcomesheading-xl · 60/72 · 3.75rem · 0
Outsized outcomesheading-lg · 48/58 · 3rem · -0.4px
Outsized outcomesheading-md · 36/43 · 2.25rem · -0.2px
Outsized outcomesheading-sm · 24/32 · 1.5rem · 0
3.4
Text scale
The reading scale, for body copy and UI text. Body is set at 16/24, three baselines per line, so running text lands on the grid.
The quick brown fox jumps over the lazy dog.text-xl · 20/28 · 1.25rem
The quick brown fox jumps over the lazy dog.text-lg · 18/24 · 1.125rem
The quick brown fox jumps over the lazy dog.text-base · 16/24 · 1rem
The quick brown fox jumps over the lazy dog.text-sm · 14/20 · 0.875rem
The quick brown fox jumps over the lazy dog.text-xs · 12/16 · 0.75rem
3.5
Leading
Leading is the space between lines, measured baseline to baseline. Body copy is set at 16/24. It is generous enough to read and tight enough to hold as a block. Too tight and the lines collide; too loose and they stop reading as one paragraph.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
3.6
Tracking
Set Alix Sans as drawn. Large display type takes a slight negative tracking to close the gaps at scale; body copy stays at zero. Never letterspace lowercase text, and never tighten body to fit.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
In 1923 the company became what we now know as a household name. By the middle of the century it had become synonymous with modern design: content placed clearly and set to be read.
3.7
Hierarchy
Set one clear hero and make everything else support it. Step down the size and mute supporting copy. The reader feels the order without a single bold stroke.
Section 03 · Typography
Hierarchy comes from size and colour.
Supporting copy steps down in size and drops to muted, so the order is unmistakable, and the whole page is still set in a single weight.
3.8
Monospace
Use Geist Mono for information that should read as data: token names, specifications, numeric labels, and code. Its fixed advance keeps figures and tables aligned. Never set running prose in it.
--font-monoGeist Mono
heading-xl60 / 72
0 1 2 3 4 5 6 7 8 9tabular-nums
3.9
Misuse
The typographic voice is protected. Set Alix Sans as drawn, in sentence case, at full contrast, and never reach for these treatments.
Outsized
Outsized outcomes, built to be read
Outsized
Outsized
Outsized
Outsized