Text
Utilities to control the text
Colors
| Class | Properties |
|---|---|
| text-primary | color: var(--dash-color-primary) |
| text-secondary | color: var(--dash-color-secondary) |
| text-white | color: var(--dash-color-white) |
| text-black | color: var(--dash-color-black) |
| text-gray | color: var(--dash-color-gray) |
| text-red | color: var(--dash-color-red) |
| text-orange | color: var(--dash-color-orange) |
| text-yellow | color: var(--dash-color-yellow) |
| text-green | color: var(--dash-color-green) |
| text-teal | color: var(--dash-color-teal) |
| text-blue | color: var(--dash-color-blue) |
| text-indigo | color: var(--dash-color-indigo) |
| text-cyan | color: var(--dash-color-cyan) |
| text-purple | color: var(--dash-color-purple); |
| text-pink | color: var(--dash-color-pink); |
| text-none | color: transparent; |
Sizes
| Class | Properties |
|---|---|
| text-xs | font-size: var(--dash-size-xs); |
| text-sm | font-size: var(--dash-size-sm); |
| text-md | font-size: var(--dash-size-md); |
| text-lg | font-size: var(--dash-size-lg); |
| text-xl | font-size: var(--dash-size-xl); |
| text-2xl | font-size: var(--dash-size-2xl); |
| text-3xl | font-size: var(--dash-size-3xl); |
| text-4xl | font-size: var(--dash-size-4xl); |
| text-5xl | font-size: var(--dash-size-5xl); |
| text-6xl | font-size: var(--dash-size-6xl); |
| text-7xl | font-size: var(--dash-size-7xl); |
| text-8xl | font-size: var(--dash-size-8xl); |
| text-9xl | font-size: var(--dash-size-9xl); |
| text-full | font-size: var(--dash-size-full); |
| text-screen | font-size: var(--dash-size-screen); |
Variants
| Class | Properties |
|---|---|
| text-normal | font-weight: var(--dash-font-weight-normal); |
| text-medium | font-weight: var(--dash-font-weight-medium); |
| text-semibold | font-weight: var(--dash-font-weight-semibold); |
| text-bold | font-weight: var(--dash-font-weight-bold); |
| text-extrabold | font-weight: var(--dash-font-weight-extrabold); |
| text-italic | font-style: italic |
| text-normal | font-weight: var(--dash-font-weight-normal); |
Align
| Class | Properties |
|---|---|
| text-center | text-align: center |
| text-left | text-align: left |
| text-right | text-align: right |
| text-justify | text-align: justify |
Decoration
| Class | Properties |
|---|---|
| underline | text-decoration: underline |
| line-through | text-decoration: line-through |
| no-underline | text-decoration: none |
Transform
| Class | Properties |
|---|---|
| capitalize | text-transform: capitalize; |
| uppercase | text-transform: uppercase; |
| lowercase | text-transform: lowercase; |
| ellipsis | text-transform: ellipsis; |