テーマ

Visual Studio Code には、3 種類のテーマがあります。

  • カラーテーマ: UI コンポーネント識別子とテキストトークン識別子から色へのマッピングです。カラーテーマを使用すると、VS Code UI コンポーネントとエディター内のテキストの両方に好みの色を適用できます。
  • ファイルアイコンテーマ: ファイルタイプ/ファイル名から画像へのマッピングです。ファイルアイコンは、ファイルエクスプローラー、クイックオープンリスト、エディタータブなど、VS Code UI 全体で表示されます。
  • 製品アイコンテーマ: サイドバー、アクティビティバー、ステータスバーからエディターのグリフマージンまで、UI 全体で使用されるアイコンのセットです。

カラーテーマ

color-theme

図に示すように、カラーテーマは UI コンポーネントの色とエディターでの強調表示の色を定義します。

  • colors マッピングは、UI コンポーネントの色を制御します。
  • tokenColors は、エディターでの強調表示の色とスタイルを定義します。 構文ハイライトガイド に、このトピックに関する詳細情報が記載されています。
  • semanticTokenColors マッピングと semanticHighlighting 設定を使用すると、エディターでの強調表示を強化できます。 セマンティックハイライトガイド で、これに関連する API について説明しています。

テーマの作成方法を示す カラーテーマガイドカラーテーマのサンプル があります。

ファイルアイコンテーマ

ファイルアイコンテーマを使用すると、次のことが可能になります。

  • 一意のファイルアイコン識別子から画像またはフォントアイコンへのマッピングを作成します。
  • ファイル名またはファイル言語タイプによって、ファイルをこれらの一意のファイルアイコン識別子に関連付けます。

ファイルアイコンテーマガイド では、ファイルアイコンテーマの作成方法について説明しています。 file-icon-theme

製品アイコンテーマ

製品アイコンテーマを使用すると、次のことが可能になります。

ワークベンチで使用されるすべての組み込みアイコンを再定義します。例としては、フィルターアクションボタンとビューアイコン、ステータスバー、ブレークポイント、およびツリーとエディターの折りたたみアイコンのアイコンがあります。

製品アイコンテーマガイド では、製品アイコンテーマの作成方法について説明しています。