Text Intent Overview
Text intent contains element's typography related utilities.
Utilities available in @text intent are listed below.
| Utility | Description | Documentation |
|---|---|---|
align-* | Align text content within element along main-axis and cross-axis. | align |
break-* | Control text breaking and word wrapping. | break |
case-* | Transform text case to upper, lower, or capitalize. | case |
color-* | Set text color for elements. | color |
content-* | Set text content for pseudo-elements (::before and ::after). | content |
family-* | Set font family for text elements. | family |
gap-* | Control spacing between letters and words. | gap |
h-* | Set line height. | h |
line-* | Control text decoration (line). | line |
lines-* | Control number of visible text lines (clamping). | lines |
move-* | Set empty space (indentation) before text block (lines). | move |
nums-* | Set numeric glyph styling (tabular, lining, etc.) | nums |
overflow-* | Handle overflowing text. | overflow |
shadow-* | Add text shadow effects. | shadow |
size-* | Set text size for text elements. | size |
space-* | Control white space in text. | space |
style-* | Set text style for text elements. | style |
thick-* | Set text's thickness (weight). | thick |