clamp()
Eine CSS-Funktion, die drei Werte nimmt — Minimum, bevorzugt und Maximum — und das Ergebnis innerhalb dieses Bereichs hält. clamp(1rem, 2.5vw, 2rem) liefert einen Wert, der mit dem Viewport skaliert, aber nie unter 1rem oder über 2rem geht. Die Grundlage für „fluides" responsives Design.
Mechanik: clamp(MIN, BEVORZUGT, MAX) = max(MIN, min(BEVORZUGT, MAX)). Der bevorzugte Wert ist oft viewport-relativ (vw), damit er sanft mit der Bildschirmgröße skaliert, während Min/Max vernünftige Grenzen setzen. Klassischer Anwendungsfall: fluide Typografie — Überschriften, die sanft mit dem Bildschirm mitwachsen, statt an Media-Query-Breakpoints zu springen (font-size: clamp(1.5rem, 4vw, 3rem)). Auch für Abstände, Breiten, Padding. Der Gewinn: eine einzige Zeile ersetzt mehrere Media Queries und ergibt ein durchgängig angepasstes Layout. Wird oft mit Custom Properties und calc() für komplexere Formeln kombiniert. Gehört zusammen mit min() und max() zu CSS' mathematischen Funktionen. Eine moderne Grundtechnik für responsives Design. Hängt eng mit CSS Custom Properties und Container Queries zusammen.