この記事の目次 開く・閉じる
今回の仕上がり
GeistはVercelとBasement Studioによる書体です。今回はSansの可変TTFをGoogle Fontsの配布元から取得し、英数字を表示する自作例へ読み込みました。MonoやPixelは今回の対象に含めていません。
同じ文字を太さ400と700で切り替え、標準sans-serifとも比較できます。元のフォントファイルは169,056バイトで、改変せず同梱しています。ブラウザのフォント読み込み成功と、700への変更、標準書体からGeistへの切り替えを確認しました。
作例の操作
- 下の作例で「フォント読み込み済み」を確認します。
- 「太さ」を400から700へ変え、Createと数字の線を見比べます。
- 「書体」を標準sans-serifへ変え、Geistへ戻します。
- 保存用ZIPを展開し、example.htmlを開くと同じ作例を使えます。
標準書体は端末ごとに異なります。日本語は代替書体へ任せる例で、Geistだけで日本語全体を表示できるという意味ではありません。既存サイト全体の書体は変更していません。
利用条件と確認範囲
公式案内と配布元を参照しました。ライセンスはSIL Open Font License 1.1です。商用制作での使用や同梱配布は可能ですが、フォント単体の販売は禁止され、同梱時は著作権・ライセンスを保持します。改変時の名称などの条件もあるため、全文を確認してください。
ZIPには原本TTFとOFL、自作HTMLを収録しています。自作HTML/CSS/JavaScriptはCC0で、フォントの利用条件とは別です。今回確認したのは英数字の表示と操作であり、すべての字形、低視力の利用者による読書、スマホ実機は検証していません。
操作できる作例
確認日：2026年10月29日。PCブラウザとスマホ幅で確認。スマホ実機・読み上げ・全ブラウザは未確認です。