Typography
Heading, Text, and Separator from @cassa/ui.
Import
import { Heading, Text, Separator } from '@cassa/ui'Heading
Heading 1 — text-4xl bold
Heading 2 — text-3xl bold
Heading 3 — text-2xl semibold
Heading 4 — text-xl semibold
| Prop | Type | Default | Description |
|---|---|---|---|
| level* | 1 | 2 | 3 | 4 | 5 | 6 | — | Maps to the semantic h1–h6 element and sets the visual size. |
| className | string | — | Additional Tailwind classes. |
Text
Text XL — text-xl
Text LG — text-lg
Text MD — text-base (default)
Text SM — text-sm
Text XS — text-xs
Color: muted — neutral-500
Color: brand — brand-primary
| Prop | Type | Default | Description |
|---|---|---|---|
| size | "xs" | "sm" | "md" | "lg" | "xl" | "md" | Font size. |
| color | "default" | "muted" | "brand" | "default" | Semantic color variant. |
| as | ElementType | "p" | Underlying HTML element. |
Separator
Above the separator
Below the separator