Guide de référence pour déclarer les polices natives du système d'exploitation en CSS, offrant un rendu instantané sans chargement réseau.
Pile universelle de polices système
body {
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif;
}
Correspondance des polices par plateforme
| Nom de police / Jeton | Système d'exploitation et navigateur |
|---|---|
-apple-system |
Safari sur macOS et iOS (San Francisco) |
BlinkMacSystemFont |
Chrome / Moteur Blink sur macOS |
"Segoe UI" |
Windows 7, 8, 10, 11 |
Roboto |
Android moderne et ChromeOS |
Oxygen |
Linux avec environnement KDE |
Ubuntu |
Linux avec Ubuntu Unity / GNOME |
Cantarell |
Linux avec GNOME 3+ |
"Fira Sans" |
Firefox OS / environnements Mozilla |
"Droid Sans" |
Anciens appareils Android |
"Helvetica Neue" |
macOS 10.9 (Mavericks) et 10.10 (Yosemite) |
sans-serif |
Police sans-serif de secours universelle |
Mot-clé générique moderne (system-ui)
Dans CSS Fonts Module Level 4, les navigateurs modernes prennent en charge le mot-clé standardisé :
body {
font-family: system-ui, sans-serif;
}