CSS - clamp() function

clamp(MIN, VAL, MAX)

The clamp() CSS function clamps a value between an upper and lower bound. clamp() enables selecting a middle value within a range of values between a defined minimum and maximum. It takes three parameters: a minimum value, a preferred value, and a maximum allowed value.

You can replace min, max usage with clamp function.  width : clamp(100px, 40%, 300px); 100px is minimum value, 40% is preferred value and 300px is maximum value. The clamp() function can be used anywhere length, frequency, angle, time, percentage, number or integer is allowed.

Ref : mozilla.org