Experiment

Typografie Playground

Ein kleiner Spielplatz für Lesbarkeit, Rhythmus und Typo-Gefühl. Schriftgröße, Zeilenhöhe, Laufweite, Gewicht und Textbreite live verändern – und sofort sehen, was das mit einem echten Text macht.

Einstellungen

Regler bewegen, Presets testen, Kontrast wechseln und am Ende auf Wunsch das CSS direkt mitnehmen.

Schriftfamilie Sans Wechselt den Charakter von sachlich bis editorial.

Schriftgröße 22 px Größer ist nicht automatisch besser – es geht um Lesefluss.

Zeilenhöhe 1.65 Mehr Luft macht längere Texte meist entspannter lesbar.

Laufweite 0.00 px Kleine Änderungen reichen oft schon für einen ganz anderen Eindruck.

Gewicht 450 Feinere Zwischenstufen wirken oft moderner als hartes 400 oder 700.

Textbreite 38 rem Zu breite Textblöcke machen Lesen schneller anstrengend.

Beispieltext Du kannst den Text ändern und direkt mit eigenem Copy testen.

Presets

Kontrast / Oberfläche

Größe 22 px Die Basis für das gesamte Lesebild

Rhythmus 1.65 Zeilenhöhe als Taktgeber für Lesefluss

Zeilenlänge 38 rem Wie breit der Leseblock maximal laufen darf

Live-Vorschau

Nicht abstrakt als Zahlen, sondern direkt im Text. So merkt man sofort, wann Typografie ruhig, edel oder anstrengend wird.

Live Text Sample

Typografie macht Atmosphäre sichtbar

Die Vorschau reagiert sofort auf jede kleine Veränderung.

CSS-Snippet

Ein kompakter Output, den man direkt in ein Projekt übernehmen oder als Ausgangspunkt nutzen kann.

Worauf man achten sollte

Typografie wirkt am stärksten in kleinen Abstufungen. Meist ist nicht „mehr“ besser, sondern stimmiger.

Zu breite Textblöcke ermüden schnell – besonders auf großen Bildschirmen.
Mehr Zeilenhöhe hilft langen Absätzen, kann bei großen Headlines aber träge wirken.
Etwas Laufweite kann Headlines eleganter machen, bei Fließtext aber schnell Unruhe erzeugen.
Ein Gewicht zwischen 430 und 500 wirkt oft moderner als ganz klassisches 400.
Typografie ist nie nur Technik – sie verändert den Charakter einer ganzen Seite.