Typographie
DM Sans, l’échelle de graisses, la hiérarchie des titres et les tokens de texte qui basculent automatiquement en dark mode.
Police
Guest Suite utilise DM Sans (Google Fonts), sans-serif faible contraste optimisée pour la lecture écran.
DM Sans
AaBbCcDdEe — 0123456789 — l’éréputation au cœur du produit
:root { --font-sans: 'DM Sans', sans-serif; }Graisses
| Token | Poids | Usage | Aperçu |
|---|---|---|---|
font-normal | 400 | Corps de texte | Guest Suite |
font-medium | 500 | Labels, navigation | Guest Suite |
font-semibold | 600 | Titres, emphase, labels de CTA | Guest Suite |
font-bold | 700 | Fort contraste (rare) | Guest Suite |
Hiérarchie des titres
H1Piloter son e-réputation
H2Piloter son e-réputation
H3Piloter son e-réputation
H4Piloter son e-réputation
Tokens de texte (--ui-text-*)
Mappés sur la palette slate, basculent en dark mode.
| Token | Shade | Usage |
|---|---|---|
| --ui-text-highlighted | 900 #0f172a | Titres, labels importants |
| --ui-text | 700 #334155 | Texte principal |
| --ui-text-toned | 600 #475569 | Emphase légère / secondaire sur surface |
| --ui-text-muted | 500 #64748b | Secondaire (sur blanc uniquement) |
| --ui-text-dimmed | 400 #94a3b8 | Décoratif uniquement (jamais lisible) |
Règles
À faire
- Un seul H1 par page.
- Titres en
font-semibold(600). - Respecter H1 → H2 → H3.
--ui-text-mutedpour le secondaire.
À éviter
- Plusieurs H1.
- Titres en
font-bold(700) — trop lourd. - Sauter un niveau pour le style.
- Hardcoder
color: #64748b.