Skip to content

Text Transformation ​

Utilities for specifying the transformation of text.

Class NameCSS Equivalent
.capitalizetext-transform: capitalize;
.uppercasetext-transform: uppercase;
.lowercasetext-transform: lowercase;
.case-normaltext-transform: none;

Text Transformation Classes ​

The .{transform} classes set the text-transform property to control the transformation of text within the block.

.capitalize
.uppercase
.lowercase
.case-normal
CEO
Alice Johnson
alice.johnson@company.com
About
Nulla dolor velit adipisicing duis excepteur esse in duis nostrud occaecat mollit incididunt deserunt sunt. Ut ut sunt laborum ex occaecat eu tempor labore enim adipisicing minim ad. Est in quis eu dolore occaecat excepteur fugiat dolore nisi aliqua fugiat enim ut cillum. Labore enim duis nostrud eu. Est ut eiusmod consequat irure quis deserunt ex. Enim laboris dolor magna pariatur. Dolor et ad sint voluptate sunt elit mollit officia ad enim sit consectetur enim.
html
<div class="capitalize">This text is capitalized</div>
<div class="uppercase">This text is in uppercase</div>
<div class="lowercase">This text is in lowercase</div>
<div class="case-normal">This text has no transformation</div>