タイポグラフィ スケールは、一貫した数学的比率に従う一連のフォント サイズです。サイズをランダムに選択するのではなく、各ステップに同じ比率を掛けて、見出し、本文、キャプション全体に視覚的なリズムと階層を作成します。
基本サイズ (16 ピクセルがブラウザのデフォルトであり、確実な開始点です) を選択し、比率を選択します。 1.125 のような小さい比率では、編集サイトに微妙でエレガントなスケールが作成されます。 1.618 のような大きな比率では、マーケティング ページに劇的なコントラストが作成されます。
Frequently Asked Questions
Q: モジュラースケールとは何ですか?
モジュラースケールとは何ですか?モジュラースケールは、基本サイズに固定比率を繰り返し乗算して得られる一連のサイズです。これは音階の背後にあるのと同じ計算です。
Q: どの比率を選択すればよいですか?
どの比率を選択すればよいですか?一般的な Web 用途では、1.333 (完全 4 倍) から始めてください。緻密なインターフェイスには 1.2、大胆なマーケティング サイトには 1.5、印象的な編集デザインには 1.618 を使用します。
Q: 16px が標準の基本サイズなのはなぜですか?
16px が標準の基本サイズなのはなぜですか? 16px は、すべてのブラウザのデフォルトのルート フォント サイズです。それに基づいてスケールを設定すると、ユーザーがブラウザーのズームやアクセシビリティの設定を変更するときの一貫性が保証されます。
Q: pxの代わりにremを使用する必要がありますか?
pxの代わりにremを使用する必要がありますか?はい。スケールを px で定義しますが、アクセシビリティのために rem を適用します。1rem はルート フォント サイズに等しいため、rem ベースのサイズはユーザー設定に合わせてスケールされます。
Q: スケールには何ステップ必要ですか?
スケールには何ステップ必要ですか? 6 ～ 8 ステップでほとんどのニーズ (キャプション、小、本文、h4 ～ h1 範囲、表示サイズ) をカバーします。手順が増えるとメンテナンスが増えますが、あまりメリットはありません。
日本の伝統色・和色
和色は平安時代の襲（かさね）の色目に由来する日本の伝統色。桜や山吹、瑠璃など、植物や自然の名前を冠した優しい色合いが特徴で、JIS慣用色名としても制定されています。現代のUIデザインにも落ち着いた配色として人気です。
山吹色 #F8B500山吹の花に由来する黄金色。JIS慣用色名
撫子色 #EEA9A9ナデシコの花の淡いピンク。平安時代から愛される
茜色 #B7282E茜草の根から染めた深い赤。夕焼けの色
若草色 #C3D825春の新芽を思わせる明るい黄緑
瑠璃色 #1E50A2仏教の七宝「瑠璃」に由来する深い青
桜色 #FEF4F4桜の花びらのようなごく淡いピンク
常磐色 #007B43常緑樹の深い緑。永遠を象徴する
Q: 和色とは何ですか？
和色とは何ですか？和色は平安時代の襲の色目に由来する日本の伝統色で、桜・山吹・瑠璃など自然の名を冠した色が多く、JIS慣用色名として269色が制定されています。
Q: 山吹色はどんな色ですか？
山吹色はどんな色ですか？山吹の花に由来する黄金色で、色値は #F8B500。JIS慣用色名の一つで、太田道灌の逸話でも知られる日本の代表色です。