Need Review

Last modified:

Use these heading classes set text styles for `h1` to `h6`.

ℹ️ This component competes with Display type and deserves a design review.

Example of Headings - default

  <h1 class="bc-h1">heading handgloves 1</h1>
  <h2 class="bc-h2">heading handgloves 2</h2>
  <h3 class="bc-h3">heading handgloves 3</h3>
  <h4 class="bc-h4">heading handgloves 4</h4>
  <h5 class="bc-h5">heading handgloves 5</h5>
  <h6 class="bc-h6">heading handgloves 6</h6>

React documentation

Last modified:

ℹ️ This feature doesn’t have a corresponding React component yet.


Last modified:

Apply these to all headings, ideally with the corresponding class.

Use semantic markup for Headings, eg. heading tags (h1..6).


Last modified:

Heading styles provide a consistent hierarchy of titles to structure and title sections.

Our Headings scale in size inversely with the heading unit size, which is built to match the corresponding HTML heading hierarchy.


Last modified:

Headings should use semantic markup.

Heading hierarchy levels must be sequential in nested sections, that is, a h2 and its content should not be followed by a h4 but instead a h3 if structured deeper. Meanwhile, it’s of course fine to jump “back up”, from say a h4 to a new higher-level h2 section.


Last modified:

Headings are commonly understood way of structuring and titling sections of a page.

See also

Last modified: