Heading

A text heading.

It implements the <h1>, <h2>, <h3>, <h4>, <h5>, or <h6> element.

It should be nested under a sectioning element such as <section> or <article> for a semantic HTML document outline.

Props

size

Type1 | 2 | 3 | 4 | 5 | 6 (optional)

Sets the CSS font-size via a global theme CSS variable, e.g. --daui-h1-font-size. Omit if setting a custom font-size.

Examples

Suitable for a primary page heading.
import { Heading } from 'device-agnostic-ui'

<Heading size={1}>Heading</Heading>

Heading

Suitable for a secondary page heading, with an ID.
import { Heading } from 'device-agnostic-ui'

<Heading level={2} size={2} id="heading">
  Heading
</Heading>

Tags