font-size |
Taille de la police de caractères |
|---|---|
| Tailwind CSS | |
Classe
| font-size |
Description
Cet utilitaire contrôle la taille des caractères, ajustant la visibilité et l'impact visuel du texte.
Définition
| Classe | Styles |
|---|---|
| text-xs | font-size: var(--text-xs); /* 0.75rem (12px) */ line-height: var(--text-xs--line-height); /* calc(1 / 0.75) */ |
| text-sm | font-size: var(--text-sm); /* 0.875rem (14px) */ line-height: var(--text-sm--line-height); /* calc(1.25 / 0.875) */ |
| text-base | font-size: var(--text-base); /* 1rem (16px) */ line-height: var(--text-base--line-height); /* calc(1.5 / 1) */ |
| text-lg | font-size: var(--text-lg); /* 1.125rem (18px) */ line-height: var(--text-lg--line-height); /* calc(1.75 / 1.125) */ |
| text-xl | font-size: var(--text-xl); /* 1.25rem (20px) */ line-height: var(--text-xl--line-height); /* calc(1.75 / 1.25) */ |
| text-2xl | font-size: var(--text-2xl); /* 1.5rem (24px) */ line-height: var(--text-2xl--line-height); /* calc(2 / 1.5) */ |
| text-3xl | font-size: var(--text-3xl); /* 1.875rem (30px) */ line-height: var(--text-3xl--line-height); /* calc(2.25 / 1.875) */ |
| text-4xl | font-size: var(--text-4xl); /* 2.25rem (36px) */ line-height: var(--text-4xl--line-height); /* calc(2.5 / 2.25) */ |
| text-5xl | font-size: var(--text-5xl); /* 3rem (48px) */ line-height: var(--text-5xl--line-height); /* 1 */ |
| text-6xl | font-size: var(--text-6xl); /* 3.75rem (60px) */ line-height: var(--text-6xl--line-height); /* 1 */ |
| text-7xl | font-size: var(--text-7xl); /* 4.5rem (72px) */ line-height: var(--text-7xl--line-height); /* 1 */ |
| text-8xl | font-size: var(--text-8xl); /* 6rem (96px) */ line-height: var(--text-8xl--line-height); /* 1 */ |
| text-9xl | font-size: var(--text-9xl); /* 8rem (128px) */ line-height: var(--text-9xl--line-height); /* 1 */ |
| text-(length:<propriete-personnalisee>) | font-size: var(<propriete-personnalisee>); |
| text-[<valeur>] | font-size: <valeur>; |
Dernière mise à jour : Vendredi, le 6 février 2026