UIをきちんと見せる無料フォント

UIが素人くさく見える原因は、色よりも組版であることのほうがずっと多いです。書体が違う、サイズが違う、行間が違う。

ここに挙げるのは無料で商用可、しかも紙ではなく画面のために描かれた書体です。

UI向けサンセリフ

Inter

堅実な既定解。画面の小さめサイズ向けに設計され、ダッシュボードに要る数字のバリエーションも揃います。

rsms.me/inter

UI向けサンセリフ

Geist

Vercelの書体。Interより幾何学的で、対になる等幅も用意されています。

vercel.com/font

見出しとUI

Manrope

見出しにも本文にも使えるので、2つ目のファミリーを読み込まずに済みます。

fonts.google.com/specimen/Manrope

ファミリー一式

IBM Plex Sans

サンセリフ、セリフ、コンデンス、等幅が揃い、互いに調和します。

ibm.com/plex

UI向けサンセリフ

Source Sans 3

Adobeのオープン書体。とても読みやすく、まず誰も文句を言いません。

fonts.google.com/specimen/Source+Sans+3

見出し向け

Space Grotesk

ランディングページに個性を与えつつ、本文サイズでも読めます。

fonts.google.com/specimen/Space+Grotesk

等幅

JetBrains Mono

何時間もコードを読むために設計されています。合字は切ることもできます。

jetbrains.com/lp/mono

自前配信

Fontsource

上記どれでもnpmパッケージとして入れられ、Google Fonts依存から抜けられます。

fontsource.org

たいていの製品ではファミリーは2つが上限です。UI用に1つ、コード用に1つ。

選ぶだけでなく、作る必要がありますか?

Webアプリ、API、インフラ、インターフェース。バルセロナ拠点のフリーランス、世界中のクライアントと。

問い合わせる


Comments

Leave a Reply

Your email address will not be published. Required fields are marked *