Typography

Text variants: h1–h4, body1, body2, caption, label.

Heading 1

Heading 2

Body text.

Caption text.

How to use

Import Typography and use variant: h1–h4, body1, body2, caption, label. Copy the examples below.

1. Import

tsx

import { Typography } from "@/app/components/ui";

2. Variants

tsx

<Typography variant="h1">Heading 1</Typography>
<Typography variant="h2">Heading 2</Typography>
<Typography variant="h3">Heading 3</Typography>
<Typography variant="h4">Heading 4</Typography>
<Typography variant="body1">Body text.</Typography>
<Typography variant="body2">Body small.</Typography>
<Typography variant="caption">Caption text.</Typography>
<Typography variant="label">Label text.</Typography>