A component that sets the heading level for its children. It doesn't render any HTML element, just sets the level prop on the context.

Code examples

<Heading>Heading 1</Heading>
<Heading>Heading 2</Heading>

Optional Props


HeadingLevels | undefined

The heading level. By default, it'll increase the level by 1 based on the context.

Stay tuned

Join 1,000+ subscribers and receive monthly tips & updates on new Ariakit content.

No spam. Unsubscribe anytime. Read latest issue