clamp()-Rechner für fließende Schrift
Gib die Mindestgröße, die Maximalgröße und zwischen welchen Bildschirmbreiten sie wachsen soll an. Der Rechner berechnet die Gerade und liefert das fertige clamp().
So geht’sFließende Größe mit clamp()
Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich.
clamp()-Rechner für fließende Schrift: wofür es gut ist
Mit clamp() wächst der Text mit der Bildschirmbreite, ohne mehrere Media Queries: klein auf dem Handy, groß auf dem Computer und mit sanftem Übergang dazwischen.
Der Rechner berechnet die Gerade zwischen Mindest- und Maximalgröße bei den gewählten Bildschirmbreiten und liefert den Wert in rem, der die von der Person eingestellte Schrift respektiert. Er zeigt die Größe bei jeder gängigen Breite und warnt, wenn das Maximum mehr als das 2,5-Fache des Minimums beträgt, ab dem der von WCAG 1.4.4 geforderte 200-%-Zoom nicht mehr funktionieren kann.
So geht’s
- Gib Mindest- und Maximalgröße in px an.
- Wähle, zwischen welchen Bildschirmbreiten sie wächst.
- Kopiere das fertige clamp().
Wann nutzen
- Überschriften, die sich an Handy und Computer anpassen.
- Fließende Abstände zwischen Abschnitten.
- Typografische Skala ohne Media Queries.
Häufige Fragen
Wie funktioniert clamp()?
clamp(Minimum, bevorzugt, Maximum) nutzt den bevorzugten Wert, solange er zwischen den Grenzen liegt. Der bevorzugte Wert ist eine Gerade, ein Wert in rem plus ein Bruchteil von vw, der mit der Bildschirmbreite wächst: Auf dem Handy liegt er am Minimum und auf dem Computer erreicht er das Maximum.
Warum rem und nicht px?
rem folgt der Schriftgröße, die die Person gewählt hat. Mit px sieht, wer die Standardschrift wegen Leseschwierigkeiten vergrößert hat, keinen Unterschied.
Was ist der Zoom-Hinweis?
Die WCAG verlangt, dass Text auf 200 % vergrößert werden kann. Da der vw-Anteil beim Zoom nicht mitwächst, kann ein Maximum, das viel größer als das Minimum ist, diese Vergrößerung verhindern. Eine sichere Faustregel: Das Maximum sollte nicht mehr als das 2,5-Fache des Minimums betragen.
Ist das wirklich kostenlos?
Ja, 100% kostenlos. Ohne Anmeldung, ohne Abo und ohne Nutzungslimit. Alle Tools von Tools123 sind kostenlos.