Text & font

Text alignment, transform, font family, text wrapping, line clamping, and tabular figures.

Typographic utility classes in _utilities.css handle text alignment, casing, font family, and line wrapping.

Text align

Class	Declaration
`text-left`	`text-align: left`
`text-center`	`text-align: center`
`text-right`	`text-align: right`
`text-justify`	`text-align: justify`

All four classes support responsive prefixes (e.g. text-center @md:text-left).

Text transform

Class	Declaration
`uppercase`	`text-transform: uppercase`
`lowercase`	`text-transform: lowercase`
`capitalize`	`text-transform: capitalize`
`normal-case`	`text-transform: none`

Font family

Class	Token
`font-sans`	`var(--font-body)`
`font-serif`	`var(--font-heading)`
`font-mono`	`var(--font-family-mono)`

Text wrapping and overflow

Class	Declaration	Purpose
`text-balance`	`text-wrap: balance`	Balanced line breaks in short headings
`text-pretty`	`text-wrap: pretty`	Prevent orphan words in body text
`leading-none`	`line-height: 1`	Single-line labels
`tabular-nums`	`font-variant-numeric: tabular-nums`	Align numeric columns in tables/data

Line clamp

Class	Lines
`line-clamp-1`	1
`line-clamp-2`	2
`line-clamp-3`	3
`line-clamp-4`	4
`line-clamp-5`	5
`line-clamp-6`	6

<h3 class="text-h3 text-balance">Balanced headline wrapping</h3>
<p class="text-sm text-muted-foreground line-clamp-2">
  Summary truncated with an ellipsis after two lines...
</p>