実際の可変フォント

バリアブル フォントの実践ガイドを共有します。例もたくさんあります。

Rachel Andrew

まだ可変フォントの使用に踏み切っていない場合は、Evil Martians の Roman Shamin と Travis Turner による記事「Variable fonts in real life」で、優れたユースケースと、次のプロジェクトで可変フォントを使用すべき理由が説明されています。

可変フォントは、ブラウザでのサポートが充実しています。ブラウザがすべてのバリエーションに対して 1 つのフォント ファイルのみをダウンロードすれば済むため、パフォーマンスの向上に役立ちます。ただし、この記事で説明するように、フォントの太さをロゴなどの要素に合わせたり、ライトモードとダークモードのコントラストの問題を解決したり、小さなテキストを読みやすくしたりするのにも役立ちます。

Browser Support

  • Chrome: 62.
  • Edge: 17.
  • Firefox: 62.
  • Safari: 11.

Source

ヒーロー画像: Florian Klauer