画面幅に相対的ないい感じのフォントサイズを clamp を使って指定する

画面幅に相対的なフォントサイズを指定したいがあまり小さく/大きくなり過ぎないようにしたい、という場合がたまにあるかもしれません。(FirstView のキャッチコピーとかそうしたくなることある)
そんな場合に clamp が便利です。

font-size: clamp(1.5rem, 8vw - 2rem, 3rem);

clamp とは

最小値、推奨値、最大値を取る CSS の関数です。
https://developer.mozilla.org/ja/docs/Web/CSS/clamp()

モダンブラウザでは大体利用可能そうです。
https://caniuse.com/?search=clamp