流体式スケール発生器
2 つのビューポート幅にわたる最小サイズと最大サイズから実際の流体 CSS Clamp() 値を計算します。傾斜と交差点が段階的に表示され、ライブ サイズ変更プレビューが表示されます。
処理中...
0%
結果
このページでは、16 ピクセルのベースと 1.25 (長 3 度) の比率がすでに選択されている活版スケール モードで直接計算機が開きます。これは、活版印刷スケールの確実で広く使用されている開始点です。これら 2 つの数値だけから、small、base、h4、h3、h2、h1 の 6 つのサイズが生成されます。それぞれのサイズは、単一の固定サイズではなく、独自の流体クランプ() 値です。
すべてのステップで、基本サイズはモバイル側とデスクトップ側の両方で同じ値に固定されますが、見出しは狭いモバイル ビューポートよりも広いデスクトップ ビューポートでより積極的に拡大されます。これは、選択した 1 つの比率から自動的に導出される、小さな画面ではより緩やかな比率を選択し、大きな画面ではより大胆な比率を選択するのと同じ考えです。
比率を 1.125、1.2、1.333、または 1.5 に変更すると、テーブル全体が即座に再生成され、その下のボタンにより、6 つのクランプ() 値すべてが、スタイルシートの残りの部分が参照する CSS カスタム プロパティのすぐに貼り付けられるブロックとしてコピーされます。