Text decoration
| Class Name | Responsive Class | Description |
|---|---|---|
u-strike |
none | Line through text. |
u-underline |
none | Underline text. |
u-noDeco |
none | Remove text decoration. |
Text
Text transform
| Class Name | Responsive Class | Description |
|---|---|---|
u-caps |
none | Capitalize first letter of every word. |
u-lowercase |
none | Lowercase all words. |
u-allCaps |
none | Uppercase all words. |
u-regular |
none | Remove text transform. |
Text alignment
| Class Name | Responsive Class | Description |
|---|---|---|
u-txtCenter |
u-[sm|md|lg]-txtCenter |
Center align text. |
u-txtLeft |
u-[sm|md|lg]-txtLeft |
Left align text. |
u-txtRight |
u-[sm|md|lg]-txtRight |
Right align text. |
Text Size
| Class Name | Responsive Class | Description |
|---|---|---|
u-txt0 |
u-[sm|md|lg]-txt0 |
10px |
u-txt1 |
u-[sm|md|lg]-txt1 |
12px |
u-txt2 |
u-[sm|md|lg]-txt2 |
14px |
u-txt3 |
u-[sm|md|lg]-txt3 |
16px |
u-txt4 |
u-[sm|md|lg]-txt4 |
18px |
u-txt5 |
u-[sm|md|lg]-txt5 |
20px |
u-txt6 |
u-[sm|md|lg]-txt6 |
24px |
u-txt7 |
u-[sm|md|lg]-txt7 |
28px |
u-txt8 |
u-[sm|md|lg]-txt8 |
32px |
u-txt9 |
u-[sm|md|lg]-txt9 |
40px |
u-txt10 |
u-[sm|md|lg]-txt10 |
56px |
u-txt11 |
u-[sm|md|lg]-txt11 |
72px |
Text Size
These classes are deprecated as of v1.4.0 - do not use anymore.
| Class Name | Responsive Class | Description |
|---|---|---|
u-txtMicro |
none | 10px text size. |
u-txtSmallest |
none | 12px text size. |
u-txtSmaller |
none | 14px text size. |
u-txtSmall |
none | 15px text size. |
u-txtLarge |
none | 18px text size. |
u-txtLarger |
none | 24px text size. |
u-txtLargest |
none | 32px text size. |
u-txtHuge |
none | 38px text size. |
Font Weight
| Class Name | Responsive Class | Description |
|---|---|---|
u-light |
none | Make font weight light. (300) |
u-normal |
none | Make font weight normal. (400) |
u-medium |
none | Make font weight medium. (500) |
u-bold |
none | Make font weight bold. (700) |
Tracking (letter spacing)
| Class Name | Responsive Class | Description |
|---|---|---|
u-trackTight |
none | The quick brown fox jumped over the lazy dog. (-.01em) |
u-trackNormal |
none | The quick brown fox jumped over the lazy dog. (0) |
u-trackLoose |
none | The quick brown fox jumped over the lazy dog. (.06em) |
Leading (line height)
| Class Name | Responsive Class | Description |
|---|---|---|
u-leadTightest |
none | The quick brown fox jumped over the lazy dog. (1.1 - 110%) |
u-leadTighter |
none | The quick brown fox jumped over the lazy dog. (1.2 - 120%) |
u-leadTight |
none | The quick brown fox jumped over the lazy dog. (1.3 - 130%) |
u-leadNormal |
none | The quick brown fox jumped over the lazy dog. (1.4 - 140%) |
u-leadLoose |
none | The quick brown fox jumped over the lazy dog. (1.5 - 150%) |
u-leadLooser |
none | The quick brown fox jumped over the lazy dog. (1.6 - 160%) |
u-leadLoosest |
none | The quick brown fox jumped over the lazy dog. (1.7 - 170%) |
Misc
| Class Name | Responsive Class | Description |
|---|---|---|
u-breakWord |
none | Break strings when their length exceeds the width of their container. |
u-txtColorInherit |
none | Inherit the ancestor's text color. |
u-noWrap |
none | Prevent whitespace wrapping. |
u-styleNormal |
none | Make font style normal. |