Text Utilities
Sizes
.text-xl The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
.text-lg The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
.text-md The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
.text-base The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
.text-sm The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
.text-xs The quick brown fox jumps over the lazy dog, while the quick brown fox jumps over the lazy dog
Fonts & Weights
| Class | Example | Weights |
|---|---|---|
.text-monospace |
The quick brown fox jumps over the lazy dog, while the quick
brown fox jumps over the lazy dog
|
.text-100
.text-200
.text-300
.text-400
.text-500
.text-600
.text-700
.text-800
.text-900
|
.text-sans |
The quick brown fox jumps over the lazy dog, while the quick
brown fox jumps over the lazy dog
|
.text-100
.text-200
.text-300
.text-400
.text-500
.text-600
.text-700
.text-800
.text-900
|
.text-serif |
The quick brown fox jumps over the lazy dog, while the quick
brown fox jumps over the lazy dog
|
.text-100
.text-200
.text-300
.text-400
.text-500
.text-600
.text-700
.text-800
.text-900
|
.text-verdana |
The quick brown fox jumps over the lazy dog, while the quick
brown fox jumps over the lazy dog
|
.text-100
.text-200
.text-300
.text-400
.text-500
.text-600
.text-700
.text-800
.text-900
|
Inline Styles
| Class | Example |
|---|---|
.abbr |
HTML is the foundation of the World Wide Web |
.cite |
Futility UI, The Simple Web Framework |
.code |
The quick brown fox jumps over the lazy dog |
.lead |
The quick brown fox jumps over the lazy dog |
.mark |
The quick brown fox jumps over the lazy dog |
.muted |
The quick brown fox jumps over the lazy dog |
.small |
The quick brown fox jumps over the lazy dog |
.text-bold |
The quick brown fox jumps over the lazy dog |
.text-capitalize |
The quick brown fox jumps over the lazy dog |
.text-dotted |
The quick brown fox jumps over the lazy dog |
.text-double |
The quick brown fox jumps over the lazy dog |
.text-italic |
The quick brown fox jumps over the lazy dog |
.text-lowercase |
The quick brown fox jumps over the lazy dog |
.text-normal |
The quick brown fox jumps over the lazy dog |
.text-strike |
The quick brown fox jumps over the lazy dog |
.text-underline |
The quick brown fox jumps over the lazy dog |
.text-underline-none |
The quick brown fox jumps over the lazy dog |
.text-uppercase |
The quick brown fox jumps over the lazy dog |
Alignment
| Class | Example |
|---|---|
.text-center |
Hello World |
.text-left |
Hello World |
.text-right |
Hello World |