Iosevkaというフォントが良い

公開:2020/12/09
更新:2020/12/14
2 min読了の目安(約2400字IDEAアイデア記事 3

突然ですが、皆さんはどのフォントでコーディングしていますか?
monaco、Monospace、MSゴシックなど、等幅フォントを軸に種類は多種多様です
そんな中、それらを尻目に私が使っているフォントはIosevkaというフォントです

Iosevkaとは?

以下の特徴を持ったフォントです

  • 等幅フォント
  • 日本特有の文字種(㈱や㌕など)に対応
    • これらもきっちりと等幅を守っている
  • リガチャ機能あり
    • !=<=など、特定の連続した文字列を合成して別の文字で表す機能
    • エディタもリガチャに対応している必要あり(VSCodeやAtom、iTerm2は対応しているので、大抵のエディタやIDEは対応していると思います)
  • 特定の文字をプリセットの中から選ぶ事ができる
    • プリセットから選んで、特定の文字のみデザインを変更することも可能
  • 全体的な文字の太さ、デザイン、文字のゆとりも設定することが可能

特に

特定の文字をプリセットの中から選ぶ事ができる
全体的な文字の太さ、文字のゆとりも設定することが可能

が個人的に目玉です
他のフォントでは見たことないレベルで、カスタマイズが可能です
これだけでは「はい・・・?」と想像しづらい(できない)と思われるので、詳細を説明していきます

公式サイト

こちらになります

一番見てもらいたいところは

Variants à la Carte

の部分です

この通り、58文字を自分の好きなデザインに変えられることができます
他にも

  • サンセリフ調にするか否か
  • 文字の太さの調整
  • リガチャのプリセット設定
    • リガチャ自体を無効にすることも可能
    • 文字の様に文字単位でのリガチャの無効やデザイン変更はできない

という様に、自分が違和感なく使えるフォントを徹底的に設定することができます

フォントの入手方法

大きく分けて2つあります
「GitHubのReleaseページからフォントをダウンロード」と、「GitHubからソースをクローンしてビルド」になります

GitHubのReleaseページからフォントをダウンロード

この方法では、文字ごとのカスタマイズなどはできません

公式サイトにあるStylistic Setsなどのプリセットで十分という方は、以下のページからフォントをダウンロードすることができます

GitHubからソースをクローンしてビルド

以下のリポジトリをクローンして、ビルドを行うと、フォントがジェネレートされます

GitHubにも、ビルドする手順が掲載されているので、一読すると良いです

ビルドを試す

まずは、ビルドが正常に動作するか確認します

必須環境

ビルドをするには、以下の環境が必要になります

  • Node.js(12.16.0以上のバージョン)
  • ttfautohintのインストール(npm i ttfautohintでOK)

ビルド方法

負荷のかかる処理なので、別作業をしながらビルドすると、結構カクつきます
しばらく放置することになると思います

以下のコマンドを実行するだけです

npm install
npm run build -- contents::iosevka

正常に完了すれば、dist/内にフォントがあると思います

フォントをカスタマイズする

2020/12/10追記

以下のサイトで、ベース、文字、リガチャを画面上でデザインを確認しながら、ページの末尾にprivate-build-plans.tomlと実行すべきコマンドが末尾に表示されます

自分で好きな様に設定したら、private-build-plans.sample.tomlと同じ階層にprivate-build-plans.tomlを作成して、サイト上で自動的に作成されたコードをコピペします
コマンドも自動的に生成されているので、そのコマンドを実行すれば、フォントが生成されます
正常に終了したら、[buildPlans.iosevka-custom]familyに設定したフォント名のファイルができていると思います

詳細な設定項目について

各設定項目と、設定できる値については、以下を参考にしてください

前述の自動生成サイトでほぼできるはずなので、とても細かい設定をしない限り、見る必要はそんなにないと思っています

最後に

中国語、日本語は更紗ゴシックと言うフォントがあります

Iosevkaと源ノ角ゴシックをベースに指定しているみたいですが、カスタマイズはできなさそう?(やったことないので、憶測になります)