Heading
Use Heading to define a semantically relevant title to a component, section or page
It should be used for all headings, whether it’s for a page, section, card, etc.
Heading’s as prop defaults to h2 but also accepts h1, h3, h4, h5, h6. Follow semantic HTML guidelines when deciding which element to use. Also note that the size of a heading is controlled separately to which element is used. The sizes available are: xs, sm, md, lg, xl, xxl.
<Heading as="h2" size="lg">This is a heading</Heading>
API Reference
| Prop | Type | Default | Required |
|---|---|---|---|
as | JSX.IntrinsicElements | - | - |
noCapsize | boolean | - | - |
size | "xxl" | Partial<Record<Breakpoint, "xs" | "sm" | "md" | "lg" | "xl" | "xxl">> | "xs" | "sm" | "md" | "lg" | "xl" | md | - |
weight | "bold" | "medium" | Partial<Record<Breakpoint, "bold" | "medium">> | bold | - |