Text Align Utilities

Adjust text alignment with the following utility classes. Text is aligned left by default.

To adjust text alignment at a specified breakpoint, use the format -text-{direction}-{breakpoint}, where {direction} can be left, center, or right, and {breakpoint} can be xs, sm, md, lg or xl. Breakpoint-specific classes cascade downwards.

Left-aligned text

Centered text

Right-aligned text

<p class="-text-left">Left-aligned text</p>
<p class="-text-center">Centered text</p>
<p class="-text-right">Right-aligned text</p>

Optional classes:

• -text-left
• -text-center
• -text-right
• -text-left--*
• -text-center--*
• -text-right--*