Typografie

Unsere Typografie-System sorgt für Lesbarkeit, Hierarchie und eine einheitliche visuelle Sprache über alle Berührungspunkte hinweg.

Über Poppins

Hausschrift · PERBILITY

Klar. Geometrisch. Menschlich.

Eine moderne geometrische Sans-Serif-Schriftfamilie mit klarem, freundlichem Charakter. Ihre runde Formsprache unterstützt den technologischen, zugleich menschlich-nahbaren Markenauftritt von PERBILITY und sorgt für eine zeitgemäße, zugängliche Anmutung.

18 Schnitte
Global Sanskrit-Zeichen
Geometrisch Konstruktion

Die Schriftfamilie umfasst 18 Schnitte und bietet damit eine hohe gestalterische Flexibilität – von feinen Fließtexten bis zu markanten Headlines. Dank der Unterstützung von Sanskrit-Zeichen eignet sich Poppins auch für internationale und mehrsprachige Anwendungen. Die große x-Höhe der Buchstaben verbessert die Lesbarkeit insbesondere in digitalen Umgebungen und bei kleineren Schriftgraden.

Stilmerkmale

Geometrisch

Harmonische Rundungen verbinden Seriosität und Zugänglichkeit zu einer stimmigen Einheit

Neutral & Klar

Moderner Charakter, der in unterschiedlichsten Kontexten funktioniert, ohne aufdringlich zu wirken

Lesbar

Sehr gute Lesbarkeit in allen Größen – besonders wirkungsvoll auf dunklen Hintergründen

Vielseitig

Ideal für digitale Interfaces, Präsentationen und Printmedien gleichermaßen

Gewichte & Anwendung

Bold Wirkung
Innovation beginnt hier.

Für große Überschriften, markante Claims und zentrale Key-Messages.

SemiBold Struktur
Unsere Vision für morgen

Für Zwischenüberschriften, Hervorhebungen und wichtige Textpassagen.

Regular Lesbarkeit
Klare Kommunikation schafft Vertrauen und stärkt die Marke dauerhaft.

Für Fließtexte in Print und Digital, Präsentationen sowie Webinhalte.

Light Zurückhaltung
Ergänzende Information, die den Kontext vertieft und bereichert.

Für Fließtexte in Print und Digital, Präsentationen sowie Webinhalte.

Anwendungsrichtlinien

  1. 01 Headlines dürfen gerne farblich (Lila oder Gelb) betont werden.
  2. 02 In Fließtexten vermeiden wir Versalien oder Blocksatz – lieber linksbündig mit viel Zeilenabstand.
  3. 03 Keine alternierenden Fonts mischen – konsequente Anwendung sichert visuelle Integrität.

Grundprinzip

Bold für Wirkung
SemiBold für Struktur
Regular für Lesbarkeit
Light für Zurückhaltung

Über Inter

Hausschrift · PERBILITY

Präzise. Neutral. Funktional.

Eine neo-groteske Sans-Serif-Schrift, speziell für digitale Interfaces entwickelt. Inter wurde von Grund auf für die Darstellung auf Bildschirmen optimiert und bildet das typografische Rückgrat aller PERBILITY-Produkte.

9 Schnitte
500+ Sprachen
Tabular Ziffern

Inter unterstützt über 500 Sprachen und bietet dank tabellarischer Ziffern eine besondere Stärke in der Darstellung von Daten und Metriken. Die große x-Höhe und die offenen Buchstabenformen sorgen für maximale Lesbarkeit auch bei sehr kleinen Schriftgraden – ideal für kompakte UI-Elemente wie Navigation, Labels und Formulare.

Stilmerkmale

Screen-optimiert

Von Grund auf für digitale Displays entwickelt – maximale Klarheit auch bei kleinen Schriftgraden

Unsichtbar

Neutral und zurückhaltend – lenkt den Fokus auf den Inhalt, nicht auf die Schrift selbst

Datenstark

Tabellarische Ziffern für Dashboards, Datentabellen und Metriken

Interface-ready

Optimal für UI-Komponenten, Navigation, Buttons und Formulare aller Art

Gewichte & Anwendung

Bold Wirkung
1.234 Aktive Nutzer

Für wichtige UI-Labels, primäre Buttons und kritische Datenwerte.

SemiBold Struktur
Übersicht Dashboard

Für Navigation, Tabs, Kartenüberschriften und sekundäre Aktionen.

Medium Orientierung
Filter anwenden

Für Tags, Badges und sekundäre UI-Elemente.

Regular Lesbarkeit
Bitte füllen Sie alle Pflichtfelder aus.

Für Fließtexte in der App, Formulare und Hilfetexte.

Anwendungsrichtlinien

  1. 01 Inter wird ausschließlich innerhalb von Produkt-Interfaces und technischen Dokumentationen eingesetzt.
  2. 02 Für Zahlenwerte und Metriken immer die tabellarischen Ziffern nutzen – sie sind in allen Browsern standardmäßig aktiv.
  3. 03 Kein Mischen mit Poppins innerhalb derselben UI-Komponente – klare Trennung der Einsatzbereiche.

Grundprinzip

Bold für Wirkung
SemiBold für Struktur
Medium für Orientierung
Regular für Lesbarkeit

Schriftfamilien

Poppins (Brand)

Für Marketing, Brand-Kommunikation und allgemeine Überschriften

Aa Bb Cc
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

Inter (Produkt Helix)

Für UI-Elemente, technische Inhalte und Produkt-Interfaces

Aa Bb Cc
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

Typografie-Skala

Display 60px · font-bold · Poppins
Heading 1 48px · font-bold · Poppins
Heading 2 36px · font-bold · Poppins
Heading 3 30px · font-bold · Poppins
Heading 4 24px · font-semibold · Poppins
Heading 5 20px · font-semibold · Poppins
Body Large 18px · font-normal · Poppins
Body Regular 16px · font-normal · Poppins
Body Small 14px · font-normal · Poppins
Caption 12px · font-normal · Poppins

Schriftverwendung

Brand

Poppins

  • Marketing-Materialien
  • Website-Überschriften
  • Präsentationen
  • Social Media Posts
  • Kampagnen
Produkt

Inter

  • App-Interfaces
  • Buttons & Navigation
  • Formulare & Inputs
  • Daten-Tabellen
  • Technische Texte

Beispiele

Überschriften

Innovation

Innovation beginnt hier

Klare Kommunikation schafft Vertrauen und stärkt die Marke.

Poppins Brand & Marketing
Produkt-Interface
1.234
Aktive Nutzer
+12,5 %

Vergleich zum Vormonat

Inter UI & Produkt

Best Practices

Hierarchie

Nutze maximal 3–4 visuelle Ebenen durch Größe, Gewicht und Farbe. Klare Hierarchie führt den Blick.

Tipp: H1 → H2 → Body → Caption

Lesbarkeit

Zeilenlänge 60–80 Zeichen, Zeilenabstand 1,5–1,8 für Fließtext. Zu enge Sätze ermüden das Auge.

Optimal: max-width ~65ch

Kontrast

Mindest-Kontrastverhältnis 4,5:1 für Normaltexte (WCAG AA). Barrierefreiheit ist kein Kompromiss.

AA: 4,5:1 · AAA: 7:1