基準フォントサイズから黄金比タイプスケールを生成

意味のある基準からスケールを組み立てます

最も大きな見出しを先に決めるのではなく、読書体験の中心になるサイズから始めてください。Webサイトでは通常、本文の文字サイズが基準です。プレゼンテーションでは一般的なスライド本文、印刷物ではポイントで指定した標準段落サイズが基準になる場合があります。生成器はこの数値を段階ゼロとして扱います。正の段階では約1.61803399のphiを掛け、負の段階では同じ比率で割ります。そのため、上下どちらの方向にも一貫した数列ができ、すべての値が基準と数学的に結び付きます。steps_upでは基準より大きい値の数を、steps_downでは基準より小さいキャプション、注記、補助ラベルなどの数を指定します。結果を実用的で確認しやすく保つため、どちらにも上限があります。たとえば基準を十六、上方向を三段階にすると、十六を概念上の正確な中心に保ちながら、より力強い表示用サイズを順番に作れます。単位欄は変換器ではなく表示ラベルです。十六ピクセルと十六ポイントは同じ数列を作りますが、用途は異なります。この区別により、物理単位と画面単位を文脈なしで変換できるように見せることを避けています。まず読者に適した読みやすいサイズを選び、その周囲の階層をスケールで検討してください。

生成値を読み取り、丸めて適用します

応答では、指定した最大の段階から最小の段階まで順番に値が並ぶため、文字階層として容易に確認できます。各行には符号付きの段階、数値サイズ、選択した単位付きの表記、そして基準より大きいか、基準そのものか、小さいかを示す役割が含まれます。段階ゼロは常に基準として示されます。formula欄には使用した正確な規則が残るため、デザイントークンの由来を文書化したり、後から生成テーマを見直したりする際に役立ちます。精度では各サイズの小数桁数を指定します。CSSや多くのデジタルデザインツールには小数三桁が適していますが、制約の強い画面や小数を意図的に避ける印刷仕様では整数が適する場合もあります。丸めは累乗計算の後にだけ行われるため、途中の段階で丸め誤差が蓄積しません。低い精度で近接する二つの小さい値が同じになった場合は、片方を手作業で変えて比率を崩すのではなく、精度を上げてください。出力は数学的に整合した出発点であり、すべてを使用する義務ではありません。小規模な製品では基準と二つの大きな値だけを使い、編集系サイトではほぼ全段階を使うこともできます。数値をfont_size_baseやfont_size_displayなどのトークンへ移し、段階番号をコメントに残せば、後任者も孤立した値の由来を推測せず、一貫して再生成できます。

古典的な比率と実用的なタイポグラフィを両立します

完全な黄金比は強い対比を生むため、表現力のある編集レイアウト、ブランドシステム、ポスター、ランディングページに適しています。一方、多くの連続レベルを高密度なアプリケーションに収める場合は、余白を使い過ぎることがあります。必要以上の階層が生じるときは段階数を減らし、実際の書体でサイズを確認してください。エックスハイト、ウェイト、幅、オプティカルサイズによって見た目の尺度は変わります。レスポンシブなレイアウトでは、ブレークポイントごとに異なる基準サイズを用いながら段階の割り当てを保てます。これにより、デスクトップ向けの表示サイズをスマートフォンへ押し付けず、画面間の統一感を維持できます。アクセシビリティでは、読みやすい本文、快適な行長、適切な行間、十分なコントラストが引き続き重要です。美しい比率でも、小さすぎる基準や不適切な書体は補えません。このツールが計算するのはフォントサイズだけであり、行間、字間、ウェイト、セマンティックHTMLは決定しません。これらは言語、媒体、書体、情報密度に応じて選ぶ必要があります。自動化する場合は、同じ入力を一回$0.002のAPIへ送信し、返されたスケールをデザイントークンと一緒に保存してください。計算にネットワーク、乱数、現在時刻を使わないため、同じリクエストからは常に同じ値が返ります。したがって、再現性と視覚的調和の両方が重要なビルドスクリプト、スナップショットテスト、文書生成、デザインシステム監査に利用できます。