WebDesigner's Memorandumウェブデザイナーの備忘録

ターミナルのカスタマイズによく使われる「Nerd Fonts」

ターミナルの設定を調べていると、「Nerd Fontをインストールしてください」という説明を見かけることがあります。

今回はターミナルのカスタマイズによく使われる「Nerd Fonts」についてまとめます。

Nerd Fonts

Nerd Fontsは、「JetBrains Mono」や「Hack」などのいわゆるプログラミング用フォントに、アイコンフォントを追加して配布するオープンソースのプロジェクトです。

ちなみに、全体の正式名称は、複数形の「Nerd Fonts」です。
ただし、個々のフォント名には「JetBrainsMono Nerd Font」「Hack Nerd Font」のように、単数形の「Nerd Font」が使われています。

Font Awesome、Material Design Icons、Devicons、Octiconsなど、複数のアイコンセットをまとめて収録していて、2026年11月時点でアイコン数は1万を超えています。

とにかく大量のアイコンが使えるようになったプログラミング用フォントなので、ターミナルにアイコンを表示するなどのカスタマイズをしたい場合に利用されます。

なお、Nerd Fontsは無料で使えますが、フォント本体や収録アイコン、パッチ用スクリプトではライセンスが異なるため、改変・再配布する場合は配布物のライセンスを確認するようにしましょう。

名前の意味

英単語の「Nerd(ナード)」には「オタク」「マニア」といった意味があり、直訳すれば「オタクフォント」ということになります。

GUIと違ってターミナルはテキストが中心の世界で、そもそも表現に限界があります。
しかし、アイコンフォントを使えば見やすくカスタマイズできます。

Nerd Fontsには有名なアイコンフォントのアイコン(グリフ)がすべて入っているため、必要なアイコンはだいたい揃っています。
その中から好みのアイコンを使ってターミナルなどの開発環境を細かくカスタマイズできます。

まさに、「技術オタク(= Nerd)」向けのフォントです。

Nerd Fontsを活用できるツール

Nerd Fontsを使うと、プロンプトだけでなくファイル一覧やエディタ内にもアイコンを表示できます。

ツールによっては、Nerd Fontsの導入を前提としていたり、使うことで見やすくなるものがあります。
代表的なツールは下記の通りです。

ツールできることNerd Fontsを使う部分
StarshipプロンプトにディレクトリやGitのブランチ、言語のバージョンを表示するOS・言語・Gitなどのアイコン。公式の導入手順でNerd Fontが前提とされている
ezalsの代わりに、色やツリー表示を使ってファイルを一覧する--iconsで表示する、ファイルやフォルダのアイコン
Yaziターミナル上でファイルを選択・プレビュー・操作するファイル一覧などのアイコン。公式ではNerd Fontsの導入を推奨している
nvim-web-deviconsNeovimのプラグインに、ファイル名や拡張子に応じたアイコンを提供するアイコン表示にNerd Fontが必要。現行版はv3.3以降が要件

アイコンを表示するには、ツール側の設定と、対応するフォントの両方が必要です。
ただし、ezaはアイコンなしでも使えますし、StarshipにもNerd Fontの記号を使わない設定があります。

Macにインストールする方法

Nerd Fonts公式サイトの「Fonts Download」ページで好きなフォントをダウンロードができます。

Homebrewを使う場合は、フォントごとのコマンドでインストールします。
下記はJetBrains MonoのNerd Font版を入れるコマンドです。

brew install --cask font-jetbrains-mono-nerd-font

他のフォントをインストールするコマンドは、下記コマンドで探せます。

brew search nerd-font

フォントの選び方

Nerd Font・Mono・Propoの違い

Nerd Fontsでは、アイコンの幅が異なる3種類のフォントが用意されています。
例えば、JetBrains Monoの場合のフォント名と違いは下記の通りです。

種類フォント名の例アイコンの表示
Nerd FontJetBrainsMono Nerd Font大きめのアイコン。隣の文字にかかる場合がある
Nerd Font MonoJetBrainsMono Nerd Font Monoアイコンも1文字分の幅に収める
Nerd Font PropoJetBrainsMono Nerd Font Propoアイコンごとに幅が変わる

公式FAQでも、等幅が必要な環境ではMono、大きなアイコンが欲しい場合は通常版、GUIなどではPropoを選ぶと良いとされています。

最初はMonoで試し、小さく感じたら通常版と比べると選びやすいです。
通常版で文字と重なる場合は、Monoへ戻すか、使っているツールのアイコン後の余白を調整します。

日本語も同じフォントで表示したい場合

英数字中心のフォントを使うと、日本語は別のフォントから補われます。
英数字と日本語の幅や見た目をそろえたい場合は日本語フォントを合成し、Nerd Fontsのアイコンも加えたフォントが候補になります。

Homebrewから入れられるものとして、下記があります。

フォント元になるフォントCask名
白源(HackGen)NFHack + 源柔ゴシックfont-hackgen-nerd
UDEV Gothic NFJetBrains Mono + BIZ UDゴシックfont-udev-gothic-nf
PlemolJP NFIBM Plex Mono + IBM Plex Sans JPfont-plemol-jp-nf

なお、これらはNerd Fonts本体とは別のプロジェクトになります。

使っているフォントのNerd Fontが見つからない場合

使っているフォントのNerd Fontが見つからない場合は、アイコンだけを収録した「Symbols Nerd Font」をフォールバックに指定する方法もあります。

フォントを2つ以上設定できるツールがありますが、1つ目のフォントに無い文字を2つ目のフォントが補ってくれる仕組みがフォールバックです。

この仕組みを利用して、2つ目のフォントとして「Symbols Nerd Font」を指定し、1つ目のフォントには自分の好きなフォントを設定すれば好きなフォントを使いつつ、アイコンの表示もできるというわけです。

Homebrewでは、下記のコマンドでインストールできます。

brew install --cask font-symbols-only-nerd-font

ただし、指定方法はアプリによって異なり、アイコンの大きさや位置がそろわない場合もあります。
普段使うフォントのNerd Font版があれば、そちらを選ぶ方が設定はラクです。

アイコンの探し方

フォントを入れたら、使っているアプリのフォント設定を変更したり、実際にターミナルの設定などでアイコンを指定します。

アイコンは公式サイトの「Cheat Sheet」から検索できます。
試しに「git」で検索すると下記のように大量のアイコンが表示されます。

使いたいアイコンをホバーすると「icon」「Class」「UTF」「Hex Code」などでコピーできるので、コピーして設定ファイルに記入してカスタマイズします。

まとめ

ちなみに、ターミナルアプリの「Ghostty」の場合はアプリ自体にアイコンが内蔵されているので、Nerd Fontsを追加せずにアイコンを使用できます。

それ以外のターミナルやエディタでも表示をそろえたい場合は、普段使うフォントのNerd Font版を入れておくと設定しやすくなります。

正直、アイコンを表示したからといって生産性が上がるかと言われると微妙です。
しかし、現在のディレクトリのNode.jsバージョンやGitブランチを表示していると便利ですし、そういった表示をするときはアイコンの方が見やすくなりますし、スペースも圧迫せずに済みます。

ターミナルをカスタマイズしたい方は、アイコンを表示させる方向も考えてみてはいかがでしょうか。

著者について

プロフィール画像

@31mskz10

1997年生まれ。2016年から専門学校でデザインを学び、卒業後は神戸の制作会社でWeb制作に従事しています。Webrandumは2016年から運営し、ウェブデザイン、フロントエンド開発、WordPress、CSS、JavaScript、制作環境の効率化を中心に、実際に試した内容を執筆しています。

Twitterをフォロー Facebookでいいね