How CSS clamp() works (and a free generator that does the math for you)

The CSS clamp() function is one of the most useful tools in modern CSS,

but the math to get a correct preferred value is tedious to do by hand.

What clamp() actually does

clamp(minimum, preferred, maximum) locks a value between a floor and ceiling

while letting it scale proportionally between them based on viewport width.