単一フォントファミリーのウェイトコントラスト — ミニマリストタイポグラフィ

1つのファミリー、複数のウェイト

最高のフォントペアリングは、ペアリングをしないことかもしれません。1つのフォントファミリーを異なるウェイトで使用すると、ミニマリストデザインとブランドの一貫性に最適なクリーンで統一された外観が作成されます。

ウェイトコントラストの仕組み

セリフ vs サンセリフのコントラストの代わりに、同じファミリー内で重い vs 軽いウェイトをコントラストさせます：

h1 { font-family: 'DM Sans'; font-weight: 700; }
h2 { font-family: 'DM Sans'; font-weight: 600; }
body { font-family: 'DM Sans'; font-weight: 400; }
caption { font-family: 'DM Sans'; font-weight: 300; }

このアプローチに最適なフォント

すべてのフォントにこれを実現するのに十分なウェイトバリエーションがあるわけではありません。バリアブルフォントまたは6以上のウェイトを持つファミリーを探してください：

• Inter（100-900）：シングルファミリーシステムのゴールドスタンダード
• DM Sans（100-1000）：広いウェイトレンジとオプティカルサイズ
• Manrope（200-800）：モダンで個性的
• Nunito（200-900）：丸みがありフレンドリー

パフォーマンスの利点

バリアブルフォントファイルを使用した単一フォントファミリーは、2つの別々のフォントファミリーをロードするよりも、合計ダウンロードサイズが小さくなることがよくあります。

このアプローチを使用すべき時

シングルファミリーシステムは、ブランドが一貫性とミニマリズムを重視する場合、または多くの言語をサポートする必要がある場合（1つのフォントファミリーの方が広いUnicodeカバレッジを見つけやすい）に最適です。