Skip to main content

Heading

Use the Heading to render semantic HTML heading elements (h1, h2, etc.). The component allows you to independently define both the visual and the semantic level of the heading.

OverviewProperties

Import​

import { Heading } from '@dynatrace/strato-components/typography';

Demo​

Set visual level​

To change the visual level of the Heading component, set the level property. The visual level and the semantic level will match if not set explicitly. The default value is 1, which renders an h1 tag with the highest visual importance.

Polymorph to HTML tag​

Use the as prop to polymorph the Heading to the desired HTML tag (h1-h6), which sets the semantic level independently of the visual level.

Still have questions?
Find answers in the Dynatrace Community