Font Size Scale Calculator
Free Calculatorベースサイズとスケール比率を、調和のとれたモジュラー型タイプスケールに変換します — 1段小さいサイズと、見出し用の3段大きいサイズ。
100% プライベート
ブラウザ内で動作します — 数値がデバイスから送信されることはありません。
あなたの数値
本文テキストのサイズ（px）— ウェブでは通常16pxです。
各ステップ間の倍率。例：1.25（長3度）や1.5。
1段大きい
20
ベース × 比率 — 小見出しやリード文向け。
小（ベース ÷ 比率）
12.8
ベースより1段小さい — キャプションや注釈向け。
2段大きい
25
ベース × 比率² — セクション見出し向け。
3段大きい
31.3
ベース × 比率³ — ページ見出しやヒーロー見出し向け。
仕組み
ベースサイズを設定
本文テキストのサイズを入力します — ウェブでは16pxが一般的な出発点です。
スケール比率を選ぶ
1.2、1.25、1.5などの倍率を選び、ステップ間のコントラストを調整します。
掛けて、割る
上のステップは比率を掛け、小サイズはベースを比率で割ります。
スケールを確認
4つのサイズが即座に表示され、ベースや比率を変えるとリアルタイムで更新されます。
優れたタイプスケールには優れたスクリーンショットを
Reverze rebuilds App Store screenshots into higher-converting creative
font size scale calculator とは？
font size scale calculator は、ベースサイズと比率という2つの入力からモジュラー型のタイプスケールを作成します。見出しサイズをその都度適当に選ぶ代わりに、ベースに一定の比率を掛けて上のサイズを、比率で割って下のサイズを求めます。ベース16pxに比率1.25を使うと、小さめの12.8px、20px、25px、31.25pxが得られます。これらは同じ比率で関連し合うため、見出しと本文が視覚的に調和して見えます。
これはデザインシステムやCSSフレームワークで使われる type scale calculator と同じ考え方です。よく使われる比率は音楽の音程に由来し、1.125（長2度）、1.25（長3度）、1.5（完全5度）、1.618（黄金比）などがあります。比率が大きいほど、本文と見出しのコントラストが強くなります。この計算ツールでCSSを書く前にスケールを決め、同じ4つのサイズをウェブページ、アプリ画面、App Store のクリエイティブ全体で再利用すれば、一貫したプロ品質の見た目になります。