Text

Utilities for text alignment, transformation, wrapping, and truncation.

Alignment

Class	text-align
text-left	left
text-center	center
text-right	right
text-justify	justify
text-justify-all	justify-all

Whitespace

Class	Property	Value
text-nowrap	white-space	nowrap

Overflow

Class	Effect
text-truncate	Truncates text with … (requires overflow: hidden; white-space: nowrap)

Transform

Class	text-transform
text-uppercase	uppercase
text-lowercase	lowercase
text-capitalize	capitalize

Responsive variants

<p class="text-left md:text-center lg:text-right">
  Responsive alignment
</p>

<span class="text-lowercase md:text-uppercase">
  Responsive transform
</span>

Examples

<p class="text-center fw-bold">Centered heading</p>
<p class="text-justify lh-relaxed">Justified paragraph text</p>
<div class="text-truncate" style="width: 200px">
  Very long text that will be truncated with an ellipsis
</div>
<span class="text-uppercase ls-wider">SPACED HEADING</span>