Foundation

Typography

The system uses Poppins across a small set of named roles. Each row below is rendered with its --type-* shorthand token — the same value the components consume.

Display · var(--type-display) · Poppins Light · 48px
Placemakr — a better way to stay.
Headline · var(--type-headline) · Poppins Light · 30px
Placemakr — a better way to stay.
Title · var(--type-title) · Semibold · 20px
Placemakr — a better way to stay.
Subtitle · var(--type-subtitle) · Semibold · 17px
Placemakr — a better way to stay.
Body · var(--type-body) · Regular · 15px
Placemakr — a better way to stay.
Body small · var(--type-body-sm) · Regular · 13px
Placemakr — a better way to stay.
Label · var(--type-label) · Medium · 13px
Placemakr — a better way to stay.
Caption · var(--type-caption) · Regular · 12px
Placemakr — a better way to stay.
Eyebrow · var(--type-eyebrow) · Semibold caps · 11px
Placemakr — a better way to stay.