無料で使えるオープンソースのフォントファミリー「Interface」

コンピューター上での読みやすさを重視して作られた無料で使えるオープンソースのフォントファミリーが「Interface」です。ライセンスはSIL Open Font License 1.1準拠で、その名の通りインターフェイスデザインに使用するのにピッタリなシンプルでスッキリとしたフォントになっています。

Interface font family
https://rsms.me/interface/

InterfaceはRoboto、San Francisco、Akkurat、Asap、Lucida Grandeなどのユーザーインターフェイスに使用されるフォントに似たフォントファミリーです。他のフォントよりもサイズが小さくても判読性が高くなるようにデザインされているとのこと。

Interfaceをそれぞれ「Regular」「Medium」「Bold」という異なる線の太さおよび、イタリック体で表示すると以下のようになります。

特に小さなサイズでも読みやすくなっており、判読性が高い点がポイント。コンピューターの画面上に表示される無数の文字も、Interfaceならばより読みやすくなるというわけ。

Interfaceのフォントは以下のページ上でサイズを変えたり文字間隔を変えたり他フォントと見栄えを比較したりすることが可能です。

Interface font family

また、フォントはこのページからダウンロード可能。最新版のバージョン1.1をダウンロードするには、「Interface-1.1.zip」をクリックします。ファイルサイズは8.75MB。

「OK」をクリック。

ZIPファイルのダウンロードが済んだらExplzhなどを使って解凍。

フォルダの中には上からヒンティング処理済みのTrueTypeフォント(TTF)形式のInterface、OpenTypeフォント(OTF)形式のInterface、TTF形式のInterface、Web Open Font Format形式のInterfaceおよび、Mac/Windowsでフォントをインストールする際の方法が書かれたテキストファイルがあります。

試しに「Interface(hinted TTF)」フォルダの中にある「Interface-Bold.ttf」をインストールしてみます。インストールしたいフォントをダブルクリック。

すると以下のようなウインドウが表示されるので「インストール」をクリックすれば、フォントが自由に使えるようになります。

フォントをひとつずつインストールして使用することも可能ですが、以下のコードをCSSに加えることで、PCにインストールしていなくてもInterfaceのフォントファミリーを表示することができます。

@import url('https://rsms.me/interface/interface.css');

なお、InterfaceはオープンソースフォントなのでGitHub上でも公開されています。

GitHub - rsms/interface: The Interface font family