Text size

Adjust the size (and line height) of the text.

Class Styles
.text-xs font-size: 0.75rem;
line-height: 1.5;
.text-sm font-size: 0.875rem;
line-height: 1.5;
.text-md font-size: 1rem;
line-height: 1.5;
.text-lg font-size: 1.125rem;
line-height: 1.45;
.text-xl font-size: 1.25rem;
line-height: 1.4;
.text-2xl font-size: 1.5rem;
line-height: 1.33;
.text-3xl font-size: 1.75rem;
line-height: 1.25;
.text-4xl font-size: 2.25rem;
line-height: 1.16;
.text-5xl font-size: 3rem;
line-height: 1.08;
.text-6xl font-size: 4rem;
line-height: 1;

Example

This is extra small text.

This is small text.

This is medium text.

This is large text.

This is extra large text.

This is 2x extra large text.

This is 3x extra large text.

This is 4x extra large text.

This is 5x extra large text.

This is 6x extra large text.

<p class="text-xs">This is extra small text.</p>
<p class="text-sm">This is small text.</p>
<p class="text-md">This is medium text.</p>
<p class="text-lg">This is large text.</p>
<p class="text-xl">This is extra large text.</p>
<p class="text-2xl">This is 2x extra large text.</p>
<p class="text-3xl">This is 3x extra large text.</p>
<p class="text-4xl">This is 4x extra large text.</p>
<p class="text-5xl">This is 5x extra large text.</p>
<p class="text-6xl">This is 6x extra large text.</p>