Theme
Heading
A heading. Its level is the document outline; its size is the look, and the two can differ.
Examples
Level 1 size
Level 2
Level 3
Level 4
Formal foundations
Props
Heading
A heading. The level is semantics; the size is appearance and defaults to the level.
| Prop | Type | Default | Description |
|---|---|---|---|
level | 3 | 4 | 2 | 1 | — | The level in the document outline: h1 to h4. |
size? | "display" | 3 | 4 | 2 | 1 | level | The look, when it differs from the level's: the outline and the type scale are separate. |
id? | string | — | |
children | ReactNode | — |
Accessibility
- Choose the level from the outline, never for size: screen-reader users navigate by heading level.