Design System

Design System

Heading

Text

Overview

Page headings at six levels. Every level is 700 and tightly tracked (post-h1 to post-h6).

Live example

Native HTML first

Native HTML first

Native HTML first

Native HTML first

Native HTML first

Native HTML first

Usage

  • post-h1: set in capitals, once per page, clamped from 2.1rem to 3.9rem with 1.02 leading. Not for sentences longer than a line or two.
  • post-h2: sentence case with a 3px border underline
  • post-h3 to post-h6: sentence case with an accent rail on the inline start that thins from 5px to 1px as the level drops

Accessibility

This section is still in progress.

Related

This section is still in progress.

References

This section is still in progress.

On this page