Font Size - v3
Font-size utility classes in CodyFrame v3.
| CSS Class | Description |
|---|---|
t{p}ext-xs |
font-size: var(--text-xs); |
t{p}ext-sm |
font-size: var(--text-sm); |
t{p}ext-base |
font-size: var(--text-unit, 1em); |
t{p}ext-md |
font-size: var(--text-md); |
t{p}ext-lg |
font-size: var(--text-lg); |
t{p}ext-xl |
font-size: var(--text-xl); |
t{p}ext-xxl |
font-size: var(--text-xxl); |
t{p}ext-xxxl |
font-size: var(--text-xxxl); |
t{p}ext-xxxxl |
font-size: var(--text-xxxxl); |
Responsive #
Edit the font-size classes at specific breakpoints adding the @{breakpoint} suffix (@xs, @sm, @md, @lg, @xl).
Example:
<p class="text-lg text-xl@lg"><!-- content --></p>Font Size Unit #
Change the font-size unit on a component level.
| CSS Class | Description |
|---|---|
t{p}ext-unit-rem |
use Rem units |
t{p}ext-unit-em |
use Em units |
t{p}ext-unit-px |
use Px units |
