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
← Back to Contents