CSS-clamp()-Rechner
Geben Sie eine Größe bei kleinem Viewport und eine bei großem an. Sie bekommen das clamp(), das sanft dazwischen wandert — in rem, damit es die Schriftgröße im Browser des Lesers weiterhin respektiert.
Franz jagt im Taxi
Typografische Skala
Warum rem und nicht px
Eine Größe in px ignoriert die Schriftgröße, die der Leser im Browser gewählt hat. Dieselbe Deklaration in rem skaliert mit: Wer 20px als Standard eingestellt hat, bekommt größeren Text statt Ihrer fest gesetzten 16px. Der Viewport-Term bleibt ohnehin in vw — dabei geht es um die Bildschirmbreite, nicht um die Einstellung des Lesers.
FAQ
Was macht der mittlere Term?
Es ist eine Gerade durch Ihre beiden Punkte: ein Achsenabschnitt plus eine Steigung in vw. Unterhalb des kleinen Viewports wird der Wert auf das Minimum begrenzt, oberhalb des großen auf das Maximum.
Darf das Maximum kleiner als das Minimum sein?
Ja, und clamp() funktioniert weiterhin — aber das Ergebnis schrumpft, während der Bildschirm wächst, und das will fast niemand. Die Seite weist darauf hin, wenn es passiert.
Wird irgendetwas an Ihre Server gesendet?
Nein. Gerechnet wird in Ihrem Browser; nichts, was Sie eingeben, verlässt die Seite.
Entwickelt vom Team hinter GO AI. Alle kostenlosen Tools