# Klare serifenlose Fonts für App-Oberflächen > Serifenlose Schriftfamilien mit offener Lizenz, die in Buttons, Menüs, Tabellen und Einstellungsseiten gut lesbar bleiben und die Strichstärken mitbringen, die eine Oberfläche braucht. Eine Oberfläche verlangt von einer Schrift mehr als eine Überschrift. Der größte Teil ihres Textes ist kurz und klein: Beschriftungen mit 12 oder 13 Pixeln, Tabellenzellen, Hinweiszeilen unter einem Feld. Bei diesen Größen kommt es auf offene Öffnungen in Buchstaben wie a, e und s an, auf eine großzügige x-Höhe und auf Ziffern, die sich leicht unterscheiden lassen. Ein großes I, ein kleines l und die Ziffer 1 sollten in einem Passwortfeld nicht gleich aussehen. Das Spektrum der Strichstärken ist fast ebenso wichtig. Ein Produkt braucht meist eine Regular für den Fließtext, eine Medium oder SemiBold für Buttons und eine Bold für Hervorhebungen, jeweils mit einem Unterschied, den man auf einen Blick erkennt. Familien mit variabler Stärkenachse erlauben es, genaue Zwischenstufen zu wählen, statt sich mit dem nächstgelegenen benannten Schnitt zu begnügen. Kursive Schnitte sind in Oberflächen weniger wichtig als in Artikeln, deshalb stehen hier auch einige Familien ohne Kursive, die entsprechend gekennzeichnet sind. Erscheint dein Produkt in mehreren Sprachen, prüfe die bei jeder Familie vermerkte Schriftsystem-Abdeckung, bevor du dich festlegst. How these were chosen: Serifenlose Familien mit dem Tag für Oberflächen und mindestens vier Strichstärken; der Hinweis zu jeder Familie nennt, was der Eintrag zu Kursiven, Achsen und Schriftsystemen verzeichnet. ## Fonts (18) - [Inter](https://trendhub.net/de/fonts/inter.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Für Bildschirme gezeichnet, mit neun Strichstärken, Kursiven und einer Achse für die optische Größe, die die Buchstaben zwischen kleinen und großen Größen anpasst. - [Roboto](https://trendhub.net/de/fonts/roboto.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Neun Strichstärken mit Kursiven plus eine Breitenachse, sodass eine Familie dichte Tabellen, Fließtext und große Titel abdeckt. - [Figtree](https://trendhub.net/de/fonts/figtree.markdown) (Sans Serif, 14 Schnitte · variabel, OFL): Für Web- und Mobile-Apps gemacht: sieben Strichstärken von Light bis Black mit Kursiven auf einer variablen Achse. - [DM Sans](https://trendhub.net/de/fonts/dm-sans.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Geometrische Buchstaben mit geringem Kontrast und einer Achse für die optische Größe von 9 bis 40, für Beschriftungen und Überschriften gleichermaßen. - [Plus Jakarta Sans](https://trendhub.net/de/fonts/plus-jakarta-sans.markdown) (Sans Serif, 14 Schnitte · variabel, OFL): Offene Punzen und eine etwas hohe Kleinbuchstabenhöhe halten kleine Beschriftungen lesbar; sieben Strichstärken von ExtraLight bis ExtraBold mit Kursiven. - [Manrope](https://trendhub.net/de/fonts/manrope.markdown) (Sans Serif, 7 Schnitte · variabel, OFL): Eine variable Stärkenachse von ExtraLight bis ExtraBold mit Kyrillisch und Griechisch für mehrsprachige Produkte; nur aufrechte Schnitte. - [IBM Plex Sans](https://trendhub.net/de/fonts/ibm-plex-sans.markdown) (Sans Serif, 14 Schnitte · variabel, OFL): Sieben Strichstärken mit Kursiven und eine Breitenachse, die die Buchstaben für kompakte Panels verschmälert. - [Source Sans 3](https://trendhub.net/de/fonts/source-sans-3.markdown) (Sans Serif, 16 Schnitte · variabel, OFL): Als Oberflächenschrift ohne Serifen entworfen: acht Strichstärken von ExtraLight bis Black mit Kursiven, Kyrillisch und Griechisch. - [Work Sans](https://trendhub.net/de/fonts/work-sans.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Abgestimmt auf Bildschirmtext von 14 bis 48 Pixeln, in neun variablen Strichstärken mit Kursiven. - [Ubuntu](https://trendhub.net/de/fonts/ubuntu.markdown) (Sans Serif, 8 Schnitte, UFL): Für eine Desktop-Oberfläche gemacht und von Hand für Bildschirme gehintet; vier Strichstärken mit Kursiven. - [Nunito Sans](https://trendhub.net/de/fonts/nunito-sans.markdown) (Sans Serif, 16 Schnitte · variabel, OFL): Vier variable Achsen, darunter optische Größe und Höhe der Kleinbuchstaben, erlauben es, die Dichte anzupassen, ohne die Familie zu wechseln. - [Geist](https://trendhub.net/de/fonts/geist.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Hohe Kleinbuchstaben und Punzen, die selbst in Black offen bleiben, sodass auch fette Beschriftungen klar lesbar sind; neun Strichstärken mit Kursiven und Kyrillisch. - [Public Sans](https://trendhub.net/de/fonts/public-sans.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Eine neutrale serifenlose Schrift für ein staatliches Designsystem, in neun variablen Strichstärken mit Kursiven. - [Onest](https://trendhub.net/de/fonts/onest.markdown) (Sans Serif, 9 Schnitte · variabel, OFL): Liegt zwischen geometrisch und humanistisch, mit Buchstaben, die in kleinem Navigationstext unterscheidbar bleiben sollen; Thin bis Black mit Kyrillisch, nur aufrechte Schnitte. - [Albert Sans](https://trendhub.net/de/fonts/albert-sans.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Fast kreisrunde Bäuche und nahezu gleichmäßige Striche in neun Strichstärken mit Kursiven; nur Latein, mit vollständigen türkischen und polnischen Buchstaben. - [Be Vietnam Pro](https://trendhub.net/de/fonts/be-vietnam-pro.markdown) (Sans Serif, 18 Schnitte, OFL): Auf Technikprodukte ausgerichtet, mit vorrangig gezeichneten vietnamesischen Diakritika; neun Strichstärken mit Kursiven als statische Dateien. - [Hanken Grotesk](https://trendhub.net/de/fonts/hanken-grotesk.markdown) (Sans Serif, 18 Schnitte · variabel, OFL): Neun variable Strichstärken mit Kursiven, abgestimmt auf Beschilderung, Bücher und Oberflächen. - [Wix Madefor Text](https://trendhub.net/de/fonts/wix-madefor-text.markdown) (Sans Serif, 10 Schnitte · variabel, OFL): Der Textschnitt eines Produkt-Schriftsystems, für Oberflächen gebaut: fünf Schnitte mit Kursiv und Kyrillisch. ## FAQs ### Kann ich diese Fonts in einer kommerziellen App ausliefern? Jede Familie hier steht unter einer offenen Lizenz, meist der SIL Open Font License. Sie erlaubt die Nutzung in kommerziellen Produkten und das Einbetten in Apps. Der Lizenztext liegt jedem Download bei; die genauen Bedingungen stehen auf der Seite der jeweiligen Familie. ### Sollte eine Oberfläche einen Variable Font oder statische Dateien verwenden? Eine variable Datei liefert alle Strichstärken in einem Download und erlaubt Zwischenwerte, was hilft, wenn ein Designsystem eine 450 oder eine 550 braucht. Statische Dateien bleiben eine solide Wahl, wenn du nur zwei oder drei Strichstärken einsetzt. ### Brauche ich Kursive für Oberflächentexte? Selten. Oberflächen setzen für Hervorhebungen auf Strichstärke und Farbe. Kursive werden nützlich, wenn das Produkt längere Inhalte wie Artikel oder Dokumentation in derselben Schriftfamilie zeigt. ### Wie kombiniere ich eine serifenlose Oberflächenschrift mit einem Code-Font? Mehrere der hier aufgeführten Familien haben eine dicktengleiche Schwester mit denselben Proportionen. Mit ihr bleiben Höhen und Strichstärke zwischen Fließtext und Code einheitlich. ## Related collections - [Grotesk-Schriften (Sans Serif)](https://trendhub.net/de/fonts/for/grotesque-sans-serif-fonts.markdown) - [Humanistische serifenlose Fonts für gut lesbaren Text](https://trendhub.net/de/fonts/for/humanist-sans-serif-fonts.markdown) - [Schmale Sans-Serif-Fonts für Tabellen und enge Layouts](https://trendhub.net/de/fonts/for/narrow-fonts-for-tight-layouts.markdown) - [Monospace-Fonts zum Programmieren](https://trendhub.net/de/fonts/for/monospace-fonts-for-coding.markdown) - [Variable Fonts mit Achse für die optische Größe](https://trendhub.net/de/fonts/for/variable-fonts-with-optical-size.markdown) - [Eckige Sans-Serif-Fonts für Tech- und Spiele-Interfaces](https://trendhub.net/de/fonts/for/tech-and-game-interface-fonts.markdown) --- Source: https://trendhub.net/de/fonts/for/app-interface-fonts (trendhub)