Foundations / Typography

Typography

One font token, calibrated against platform-ui so ALPHA components sit in a host app without a typographic seam.

The font token

--font-bodysame in both modesvar(--font-lato, 'Lato'), 'Source Sans Pro', -apple-system, BlinkMacSystemFont, Helvetica, sans-serif

Lato is not shipped. Expose --font-lato in your app — next/font sets it for you — or the literal 'Lato' resolves against whatever @font-face you already declare.

var(--font-lato, 'Lato'), 'Source Sans Pro', -apple-system, BlinkMacSystemFont, Helvetica, sans-serif

Specimen

Rendered in var(--font-body)

Foundations of UI

40px / 600

Section heading

24px / 600

Body copy, the size most documentation prose is set at.

15px / 400

There is no type scale

Those sizes belong to this documentation site, not to ALPHA. The package tokenises the font family only — component type sizes live in each component's own stylesheet (the button is 13/14/15px across sm/md/lg). A scale will be added here when the package ships one.