W3 Watch Reference

clamp() 関数は、引数にカンマ区切りで、「最小値」、「中央値」、「最大値」の 3つを指定しておくことで、算出値に応じ最小値と最大値の範囲内において、「中央値」を適用することができる CSS 関数です。

中央値が最小値よりも小さくなってしまう場合は「最小値」が、中央値が最大値よりも大きくなってしまう場合は「最大値」がそれぞれ適用されます。

calc() 関数と同様に、四則計算（加算（+）、減算（-）、乗算（*）、除算（/））を使用することもでき、プロパティの値として、<length>（長さ）、<frequency>（周波数）、<angle>（角度）、<time>（時間）、<percentage>（%）、<number>（数値）、<integer>（整数） 型の値が許容される場所であれば使用できます。

.sample {
  font-size: clamp(12px, 10 * (1vw + 1vh) / 2, 100px);
}

/* clamp() 関数に対応していない Safari では、下記のように記述することで「サンプルソース01」と同じ効果を得られます */
.sample {
  font-size: max(12px, min(10 * (1vw + 1vh) / 2, 100px));
}