---
title: "<Heading>"
description: "A title (H1–H4). Inner text supports {{variables}}."
url: https://www.unitpost.com/components/heading
section: Components
updated: 2026-07-14
---
# <Heading>

## <Heading>

> A title (H1–H4). Inner text supports {{variables}}.



```tsx
<Heading level={2}>Welcome, {{first_name}}</Heading>
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `level` | enum | 2 | Heading level — controls size/weight. |
| `align` | enum | left | Text alignment. |
| `color` | color | — | Text color. |
| `font-size` | number | — | Font size (px). Overrides the level's default size (28/22/18/16 for H1–H4). |
| `font-family` | string | — | Override the document font for this heading. |
| `font-weight` | string | — | Font weight (e.g. 400, 600, 700). Overrides the default bold heading weight. |
| `line-height` | string | — | Line height — a unitless multiplier (e.g. 1.3) or CSS length. |
| `letter-spacing` | number | — | Letter spacing (tracking) in px. Great for eyebrow labels. |

## Related

- [<Text>](https://www.unitpost.com/components/text): A paragraph of body copy. Supports inline marks and {{variables}}.
- [<Button>](https://www.unitpost.com/components/button): A call-to-action — a styled, padded link that looks like a button.
- [<Link>](https://www.unitpost.com/components/link): A standalone styled hyperlink (no button background).