タイポグラフィスケールと可変フォント（clamp）

スマホとPC用の基準サイズと比率を選んでください。ツールがh1から小さいテキストまでのサイズを生成し、clamp()で2つの画面幅のあいだをなめらかに拡大します。

調和のとれたフォントサイズ

スマホの基準 (px)

スマホの比率

スマホの画面幅 (px)

PCの基準 (px)

PCの比率

PCの画面幅 (px)

プレビューのテキスト

プレビュー：

利用できる言語:

スマホとPC用に、基準サイズと比率（短2度から黄金比まで）、それぞれの画面幅を選んでください。ツールは両方の画面でh1、h2、h3、h4、h5、本文、小さいテキストのサイズを計算し、それぞれのclamp()をremで作ります。

プレビューにはスマホまたはPCでの各サイズでテキストが表示され、CSSは変数付きですぐ使える形で出力されます。

各サイズが、前のサイズに同じ比率（たとえば1.25の長3度）を掛けたものになっている一連のサイズです。見出しどうしが比例し、無作為に選んだサイズよりサイトが整って見えます。

clamp(最小値, 推奨値, 最大値) は、画面幅に応じて（推奨値にはvwを使います）、上限と下限を超えずにフォントを大きくします。これにより、メディアクエリなしで、見出しがスマホとPCで別のサイズになります。

remなら、サイズが利用者のブラウザのフォントサイズ設定に従います。読みやすいように文字を大きくしている人にとって重要です。ツールは 1rem = 16px を使います。

はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール：Tools123は無料です。