Systemschriftarten sind die Schriften, die ein Betriebssystem für seine eigene Oberfläche nutzt. Laut Google Fonts ist das Segoe auf Windows, San Francisco auf macOS und Roboto auf Android. Eine Website kann sie verwenden, ohne eine Schriftdatei zu laden, weil sie auf dem Gerät schon vorhanden sind.
- Systemschriftarten
Die Schriften, die ein Betriebssystem für seine eigene Oberfläche nutzt, etwa San Francisco, Segoe UI oder Roboto.
Beispiel: „Das Kundenportal nutzt Systemschriftarten und wirkt deshalb auf jedem Gerät wie eine native App.“Auch: Systemschriften, englisch system fonts.
Abgrenzung zur Webschrift: Sie wird per @font-face von einem Server geladen.
Die bekanntesten Systemschriftarten
Apple nennt SF Pro die Systemschrift seiner Plattformen, mit neun Gewichten und über 150 Sprachen. Segoe UI ist seit Windows Vista die Standardschrift von Windows, heute als Variable Font Segoe UI Variable. Roboto von Christian Robertson ist laut Google Standard in Android und ChromeOS.
Systemschriftarten in CSS
Die generische Familie system-ui ruft laut CSS Fonts 4 die Standardschrift der Oberfläche auf, seit März 2024 in allen großen Browsern weit verfügbar. Ältere Projekte nutzen einen System Font Stack mit den Namen der einzelnen Schriften. Die Spezifikation warnt allerdings, dass system-ui stark vom System abhängt und für lange Fließtexte nicht immer passt.
body {
font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}Vor- und Nachteile von Systemschriftarten
Sie laden sofort, verursachen keinen FOUT und keine Anfrage an einen fremden Server. Das ist auch für den Datenschutz relevant: Das Landgericht München I entschied im Januar 2022, dass das Nachladen von Google Fonts von Googles Servern die IP-Adresse unzulässig übermittelt. Der Nachteil: Die Seite sieht auf jedem System anders aus, und die Marke hat keine eigene Schrift.