POSTED | 2024.07.05
clamp()関数を簡単に! 「Min-Max-Value Interpolation」の紹介
WWEBのこと

clamp()関数とは
clamp()関数は画面幅に合わせてフォントサイズ等の最小値・最大値を変化させてくれる関数です。
とても便利な関数ですが、推奨値等の計算が若干面倒ですよね。
今回はこの計算式を簡単に作ってくれるジェネレータの紹介です。
Min-Max-Value Interpolation
わかりやすいUIなので説明が必要ないかもしれませんが、使い方を説明しますね。
VALUESのMINにフォントの最小値、MAXに最大値を入力します。
VIEWPORTにはブラウザ幅の最小値と最大値を入力します。
あとは表示されている計算式をコピーして使用すればOK!
「Live font-size example」で実際にフォントサイズを確認することもできます。
-
人気の記事
-
新着記事
-
カテゴリー
font-size: clamp(最小値, 推奨値, 最大値);