Variable Fonts (Engl., auf Dt.: ‚variable Schriften‘) werden in der professionellen Webentwicklung im CSS eingesetzt und sind der neue Font-Standard. Sie sollen die digitalen Schriftarten in der Herstellung, Verbreitung, Verarbeitung und Anwendung stark vereinfachen.
Bei den Variable Fonts handelt es sich um sogenannte linear interpolierbare Open-Type-Fonts, die ganz nebenbei auch noch verhindern, dass mit jedem neuen Schrifttyp, der auf einer Website verwendet wird, z. T. mehrere Datensätze geladen werden müssen. So wird einerseits die Ladezeit reduziert, aber auch der Umgang mit den Schriften ressourcensparender, einfacher und in vielfacher Hinsicht wesentlich kreativer.
Schriftarten sind relativ umfangreich und besitzen meist unterschiedliche Größen, Dicken, Stärken oder sogar Stile. Jede Schriftart wurde vor den Variable Fonts in einzelnen separaten Dateien gespeichert. Da kamen schnell 20 oder 30 Schriftarten und -stile zusammen. Wenn der Webentwickler oder Webdesigner für eine Website mehrere Schriftarten verwendete, mussten diese immer wieder aufs Neue geladenen werden.
Das führte zu massiven Ladeproblemen in der UX, weil die Website zu lange lud. Zudem war der Gebrauch recht limitiert für eine Zukunftstechnologie wie die moderne Webentwicklung. Aus diesem Grund entwickelten Internetgiganten wie Apple, Google und Microsoft, aber allen voran Adobe, das den Grundstock dazu schon in den Neunzigerjahren gelegt hatte, die Variable Fonts. Diese bestehen aus nur einer Schrift- oder Font-Datei, die viele Fonts enthält. Aus dieser können nun ganz unterschiedliche Fonts in diversen Schriftstärken, Breiten und Längen extrapoliert und generiert werden. Ein Schriftfont ist nun adressier- und stark erweiterbar. Der jeweilige Entwickler kann über mehrere Achsen direkt auf die Breite, Strichstärke, Schräge (kursiv) und optischen Größe zugreifen und diese bestimmen. Auch weiterführende Möglichkeiten, wie die Geschwindigkeits- und Helligkeitsachse zu bestimmen, sind beim Thema ‚Variable Fonts‘ im Gespräch.