Headings

Create a heading with Text by using the element prop to apply the appropriate styles and semantics. If you need a heading with styles that vary from the semantic meaning, e.g. an h1 that looks like an h3, you can use the appearance prop.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

<div>
  <Text as="h1">Heading 1</Text>
  <Text as="h2">Heading 2</Text>
  <Text as="h3">Heading 3</Text>
  <Text as="h4">Heading 4</Text>
  <Text as="h5">Heading 5</Text>
  <Text as="h6">Heading 6</Text>
</div>