Ghid rapid pentru declararea fonturilor native de sistem în CSS, oferind performanță maximă fără descărcarea de fonturi web.
Stivă universală de fonturi de sistem
body {
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif;
}
Maparea fonturilor pe platforme
| Nume font / Token | Sistem de operare și browser |
|---|---|
-apple-system |
Safari pe macOS și iOS (San Francisco) |
BlinkMacSystemFont |
Chrome / Motorul Blink pe macOS |
"Segoe UI" |
Windows 7, 8, 10, 11 |
Roboto |
Android modern și ChromeOS |
Oxygen |
Linux cu mediu desktop KDE |
Ubuntu |
Linux cu Ubuntu Unity / GNOME |
Cantarell |
Linux cu GNOME 3+ |
"Fira Sans" |
Firefox OS / medii Mozilla |
"Droid Sans" |
Dispozitive Android vechi |
"Helvetica Neue" |
macOS 10.9 (Mavericks) și 10.10 (Yosemite) |
sans-serif |
Font sans-serif de rezervă universal |
Cuvânt-cheie generic modern (system-ui)
În specificația CSS Fonts Module Level 4, browserele moderne acceptă cuvântul-cheie standardizat:
body {
font-family: system-ui, sans-serif;
}