DIVI Clamp Generator · NY-divine

DIVI Clamp Generator · Schriftgrößen, die mitwachsen

Gib einfach deine Desktop-Schriftgröße in Pixeln ein. Ich empfehle dir die passende Handy-Größe, rechne den exakten clamp()-Wert aus – und du siehst sofort, wie groß deine Schrift auf jedem Gerät wirklich wird.

1 · Deine Schriftgrößen

Pflichtfeld ist nur die Desktop-Größe. Die Handy-Größe schlage ich dir automatisch vor – du kannst sie jederzeit überschreiben. Tablet brauchst du nicht: Alle Zwischengrößen ergeben sich fließend aus der Formel.

Der Name ist nur deine eigene Beschriftung, damit du die Werte später zuordnen kannst – z. B. „H1", „Hero-Überschrift" oder „Zitat groß". Er taucht in der Ergebnis-Karte auf, hat aber keinen Einfluss auf die Berechnung.

Name (optional)
Desktop (px)
Handy (px)
Erweiterte Einstellungen (Viewport-Bereich)

Das sind die beiden Endpunkte der Skalierung: Beim Handy-Viewport hat deine Schrift ihre kleinste Größe, ab dem Desktop-Viewport ihre größte – dazwischen wächst sie fließend. Slider-Legende und Geräte-Vorschau passen sich automatisch an. Die Standardwerte (360 / 1600) passen für die meisten Projekte.

2 · Zieh am Bildschirm

Viewport: 1600 px

3 · Deine Werte für DIVI

Pro Größe bekommst du zwei Werte, die in DIVI direkt untereinander eingetragen werden:

Font-Size ist deine Schriftgröße als clamp()-Wert – sie wächst fließend von der Handy- zur Desktop-Größe. Diesen Wert fügst du in DIVI bei „Schriftgröße" ein (oder speicherst ihn als Number Variable).

Line-Height ist der Zeilenabstand. Warum der dazugehört: Große Überschriften brauchen engere Zeilen (sonst fallen sie auseinander), Fließtext braucht luftigere (sonst klebt er zusammen). Ich empfehle dir automatisch den passenden Wert – mit dem Schalter Kompakt · Standard · Luftig stellst du ihn enger oder weiter. Die zweizeilige Live-Vorschau zeigt dir sofort, wie der Abstand wirkt. Ausgegeben wird er mit em-Einheit, weil das DIVI-Backend Werte ohne Einheit ablehnt.