{"@context":"https://schema.org","@graph":[{"@type":"TechArticle","headline":"Heading","description":"A typographic element that enhances readability and SEO by defining section titles with hierarchical importance, improving content structure and user experience.","url":"https://intentui.com/docs/components/surfaces/heading","author":{"@type":"Person","name":"Irsyad","url":"https://x.com/irsyad"},"publisher":{"@type":"Organization","name":"Intent UI","url":"https://intentui.com","logo":{"@type":"ImageObject","url":"https://intentui.com/icon.svg"}},"mainEntityOfPage":{"@type":"WebPage","@id":"https://intentui.com/docs/components/surfaces/heading"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://intentui.com"},{"@type":"ListItem","position":2,"name":"Docs","item":"https://intentui.com/docs"},{"@type":"ListItem","position":3,"name":"Components","item":"https://intentui.com/docs/components"},{"@type":"ListItem","position":4,"name":"Surfaces","item":"https://intentui.com/docs/components/surfaces"},{"@type":"ListItem","position":5,"name":"Heading","item":"https://intentui.com/docs/components/surfaces/heading"}]}]}
Surfaces
Heading
A typographic element that enhances readability and SEO by defining section titles with hierarchical importance, improving content structure and user experience.
<> <Heading level={1}>The quick brown fox jumps over the lazy dog</Heading> <Heading level={2}>The quick brown fox jumps over the lazy dog</Heading> <Heading level={3}>The quick brown fox jumps over the lazy dog</Heading> <Heading level={4}>The quick brown fox jumps over the lazy dog</Heading></>
Manual installation
Use this approach if you prefer to install and wire up the component yourself instead of using the CLI.
Heading levels
By default, when a heading is used on a card component, it will default to level 3. Titles range from levels 1 to 4. Each level determines the title type and font size.