Design System

Heading

Display-scale typography for page titles and section headings. Uses the theme's display font.

Default

Page title

Sizes

Heading 1

Heading 2

Heading 3

Heading 4

Semantic Override

Visually h1, semantically h2

With Content

Build something great

A modular design system for every brand.

As Child

Linked heading

Custom Class

Colored heading

Props

PropTypeDefaultDescription
size"h1" | "h2" | "h3" | "h4""h1"Controls font size and responsive scaling. Also determines the HTML element unless `as` is set.
as"h1" | "h2" | "h3" | "h4"—Override the rendered HTML element. Useful when visual size and semantic level differ.
asChildbooleanfalseRender as the child element (e.g. an anchor tag) via Radix Slot.