Visual Studio Codeのファイル横に表示されるファイルアイコンのテーマまとめ

Visual Studio Codeには特定の拡張子を開いたときのタブや、サイドバーのエクスプローラーに表示されるファイルのアイコンを変更する機能があります。

ファイルアイコンの変更方法

ファイルアイコンを変更する拡張機能をインストールしたあと、Visual Studio Codeメニューバーの［コード］→［基本設定］→［ファイルアイコンのテーマ］を選択します。

あとは変更したいファイルアイコンのテーマ名を選択すれば、すぐに切り替わります。
再起動も特に必要ないですし、フォーカスを合わせた時点でプレビューされるので比較しながらどれがいいか選択できます。

ファイルアイコンのテーマ

デフォルトで入っているテーマ

まずはデフォルトで入っているテーマからですが、全部で3種類あります。

「なし」に関してはテーマというより、ファイルアイコン自体がその名の通りすべて非表示になります。

「Minimal」はファイルとフォルダの閉じている状態と開いている状態の3つのアイコンしかないシンプルな状態です。

そして「Seti」はシンプルなアイコンテーマになっています。
昔は「Minimal」がVisual Studio Codeのデフォルトで設定されていたのですが、最近は「Seti」になっているようです。

有名なテーマ

まず最も有名なテーマが「vscode-icons」です。
昔からあるテーマで最低限必要なアイコンが用意されています。

「Material Icon Theme」や「file-icons」はアイコンのテイストがある程度統一されていて、「Material Icon Theme」は若干トーンが明るくなっています。

人によってはトーンが明るいと目がチカチカしそうですし、逆に明るい方が判断しやすいという人もいるかもしれません。

他にも「VSCode Great Icons」「Icons」「Material Theme Icons」などもあります。

「Material Theme Icons」は色使いが独特で、あまり見かけない色になっているアイコンもあります。
気分を変えたい場合にはいいかもしれませんが、パッと見でファイルが判別できないのでその辺りも考えて選択するとよさそうです。

ベースがあるテーマ

少し変わったテーマとして「file-icons-mac」があります。
これは「file-icons」とほとんど一緒ですが、フォルダアイコンなど一部のアイコンがMacのFinderアイコンになっているテーマです。

Finderと一緒と識別できるテーマです。

あとは「seti-icons」は「seti」をベースにして、フォルダアイコンなど不足しているアイコンを補ったテーマになっています。

特定のフォルダ名やファイル名の場合にのみ付くアイコンもあるので、テーマを探すときはよく使うフォルダ構成で開いて確認すると比較しやすくて便利です。