Skip to content

04 — Typography

Typography

Display

Celandine Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & ? ! @ # — *

Aa Bb Cc — A serif with a contemporary edge.

Body

Urbanist Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & ? ! @ # — *

The quick brown fox jumps over the lazy dog. 1234567890.

Hierarchy

  1. display Display clamp(2.5rem, 6vw, 4.5rem)
  2. h1 H1 clamp(2.25rem, 5vw, 3.75rem)
  3. h2 H2 clamp(1.5rem, 3vw, 2.25rem)
  4. h3 H3 1.5rem
  5. body Body 1rem
  6. small Small 0.875rem

Usage

Role Family Weight Notes
Display Celandine Regular Regular Headlines and titles. Italic variants permitted.
Headings Celandine Regular Regular Section headers. Avoid bold weights.
Body Urbanist Regular Regular, 400 All paragraph copy. Line-height 1.55.
UI Urbanist Regular Medium, 500 Buttons, labels, navigation.