ターミナルの外観

Visual Studio Codeのターミナルの外観は広範囲にカスタマイズ可能です。

Sapphire テーマとカスタム Starship プロンプトを使用。フォントは Hack で、Nerd Font のシンボルを使用しています。

テキストスタイル

ターミナルのテキストは以下の設定でカスタマイズできます。

• terminal.integrated.fontFamily VS Codeで開く VS Code Insidersで開く : 使用するフォントファミリー。CSSのfontFamilyと同じ形式の文字列を受け取ります。例えば、"'Fira Code', monospace" と設定すると、プライマリフォントに Fira Code を、グリフが欠けている場合のフォールバックとして monospace を使用します。
• terminal.integrated.fontSize VS Codeで開く VS Code Insidersで開く : ターミナル内のテキストのフォントサイズを変更します。
• terminal.integrated.letterSpacing VS Codeで開く VS Code Insidersで開く : 文字間の水平方向の間隔をピクセル単位で追加設定します。
• terminal.integrated.lineHeight VS Codeで開く VS Code Insidersで開く : 行間の垂直方向の間隔を、通常の行の高さに対する乗数として設定します。例えば 1.1 と設定すると、垂直方向に10%の追加スペースが挿入されます。
• terminal.integrated.fontWeight VS Codeで開く VS Code Insidersで開く : 「通常」のテキストのフォントの太さを設定します。
• terminal.integrated.fontWeightBold VS Codeで開く VS Code Insidersで開く : 「太字」のテキストのフォントの太さを設定します。
• terminal.integrated.fontLigatures.*: 合字の設定。

Powerline シンボルと Nerd Fonts

Powerline フォントは、ターミナルで使用できる追加文字を含んだ特別なパッチ済みフォントです。VS Code のターミナルは フォントを設定しなくても Powerline シンボルの一部をレンダリングできます が、より多くのグリフが必要な場合は、font family 設定で Powerline フォントを設定してください。Powerline フォントは通常 " for Powerline" で終わります。以下の設定は、パッチ済みの DejaVu Sans Mono を設定する例です。

"editor.fontFamily": "'DejaVu Sans Mono for Powerline'"

Nerd Fonts も同様で、通常 " NF" というサフィックスが付いています。以下は Hack の Nerd Font バリアントを設定する例です。

"terminal.integrated.fontFamily": "'Hack NF'"

ターミナルのカーソル

ターミナルのカーソルのスタイルと点滅の有無は、以下の設定でカスタマイズできます。

• terminal.integrated.cursorStyle VS Codeで開く VS Code Insidersで開く : カーソルの形状を定義します（block, line, underline から選択）。
• terminal.integrated.cursorWidth VS Codeで開く VS Code Insidersで開く : カーソルのスタイルが line に設定されている時のカーソルの幅（ピクセル単位）。
• terminal.integrated.cursorBlinking VS Codeで開く VS Code Insidersで開く : ターミナルにフォーカスがある時にカーソルを点滅させるかどうか。
• terminal.integrated.cursorStyleInactive VS Codeで開く VS Code Insidersで開く : 非アクティブ時のカーソルの形状を定義します（outline, block, line, underline, none から選択）。

タブのカスタマイズ

ターミナルのタブは、デフォルトではターミナルが2つ以上ある場合に右側に表示されます。ターミナルが1つしかない場合は、ビューヘッダーにアクティブなターミナルが表示されます。

可視性

デフォルトの表示設定は水平スペースを節約するように設計されていますが、これが好ましくない場合もあります。タブの表示方法は以下の設定で変更可能です。

• terminal.integrated.tabs.hideCondition VS Codeで開く VS Code Insidersで開く : 右側のタブをいつ隠すか。never に設定すると常に表示されます。
• terminal.integrated.tabs.showActiveTerminal VS Codeで開く VS Code Insidersで開く : ターミナルビューヘッダーにアクティブなターミナルをいつ表示するか。
• terminal.integrated.tabs.showActions VS Codeで開く VS Code Insidersで開く : ビューヘッダーにアクティブなターミナルのアクションをいつ表示するか。
• terminal.integrated.tabs.location VS Codeで開く VS Code Insidersで開く : タブをターミナルの左側に表示するか右側に表示するか。
• terminal.integrated.tabs.enabled VS Codeで開く VS Code Insidersで開く : タブ機能を使用するかどうか。無効にすると、従来のドロップダウン形式に戻ります。

タブのテキスト

各タブのテキストは以下の設定で決定されます。

• terminal.integrated.tabs.title VS Codeで開く VS Code Insidersで開く : タブのタイトル。
• terminal.integrated.tabs.description VS Codeで開く VS Code Insidersで開く : タイトルの右側に表示されるテキスト。
• terminal.integrated.tabs.separator VS Codeで開く VS Code Insidersで開く : タイトルと説明の間の区切り文字。

デフォルトでは、タイトルにはシェルが検出したプロセス名が表示されます。

他のターミナルでは、シェルによって送信されたエスケープシーケンスをタイトルとして表示することが多く、以下の設定で構成可能です。

"terminal.integrated.tabs.title": "${sequence}"

利用可能なすべての変数は以下の通りです。

• ${cwd}: ターミナルの現在の作業ディレクトリ。
• ${cwdFolder}: ターミナルの現在の作業ディレクトリ。マルチルートワークスペース、または初期作業ディレクトリと値が異なる場合のシングルルートワークスペースで表示されます。Windows では、シェル統合が有効な場合にのみ表示されます。
• ${workspaceFolder}: ターミナルが起動されたワークスペース。
• ${workspaceFolderName}: ターミナルが起動されたワークスペースの名前。
• ${local}: リモートワークスペース内のローカルターミナルであることを示します。
• ${process}: ターミナルプロセス名。
• ${progress}: OSC 9;4 シーケンスによって報告される進捗状態。
• ${separator}: 値を持つ変数または静的テキストに囲まれている場合にのみ表示される条件付き区切り文字 (-)。
• ${sequence}: プロセスによってターミナルに提供された名前。
• ${task}: このターミナルがタスクに関連付けられていることを示します。
• ${shellType}: 検出されたシェルの種類。
• ${shellCommand}: シェル統合に従って実行されているコマンド。これは、検出されたコマンドラインに対する高い信頼性を必要とするため、一部のプロンプトフレームワークでは動作しない場合があります。
• ${shellPromptInput}: シェル統合に従ったシェルの完全なプロンプト入力。

アイコン

各ターミナルには、その ターミナルプロファイル によって決定される関連付けられたアイコンがあります。プロファイルで定義されていない場合に使用されるデフォルトのアイコンとその色は、 terminal.integrated.tabs.defaultIcon VS Codeで開く VS Code Insidersで開く および terminal.integrated.tabs.defaultColor VS Codeで開く VS Code Insidersで開く 設定で構成できます。

ステータス

ターミナルの「ステータス」は、もしあればタブの右側に表示されるアイコンで示されます。一部のステータスにはアニメーションが含まれています。これが気が散る場合は、以下でアニメーションを無効にできます。

"terminal.integrated.tabs.enableAnimation": false

ビジュアルベル

ターミナルのベルがトリガーされると、黄色いベルのアイコンが短時間表示されます。これは terminal.integrated.enableBell VS Codeで開く VS Code Insidersで開く で無効にでき、その持続時間は terminal.integrated.bellDuration VS Codeで開く VS Code Insidersで開く で設定可能です。

ターミナルの色

ターミナルはトゥルーカラーを表示できますが、プログラムは通常8つのANSI色（黒、赤、緑、黄、青、マゼンタ、シアン、白）とその明るいバリエーションを使用します。これらのANSI色はアクティブな カラーテーマ によって決定されますが、workbench.colorCustomizations 設定を使用してテーマとは別に構成することもできます。

太字のテキストが通常のANSI色を使用するか、明るいバリエーションを使用するかは、 terminal.integrated.drawBoldTextInBrightColors VS Codeで開く VS Code Insidersで開く 設定で構成可能です。

最小コントラスト比

ターミナルでは、ダーク/ライトテーマ、ANSI色、または実行中のシェル/プログラムなどとの競合により、コントラストの問題が発生することがよくあります。

最小コントラスト比機能は、4.5:1のコントラスト比が満たされるまで、テキストの前景色を明るくまたは暗くすることでこの問題を解決します。

この欠点は、色付きのテキストが彩度を一部失う可能性があることです。この機能は構成可能であり、元の色に戻すために無効にすることもできます。

"terminal.integrated.minimumContrastRatio": 1

合字（リガチャ）

ターミナルの 合字（リガチャ） は、複数の文字を1つとしてレンダリングします。ターミナルフォントファミリー（ terminal.integrated.fontFamily VS Codeで開く VS Code Insidersで開く ）がサポートしている場合、 terminal.integrated.fontLigatures.enabled VS Codeで開く VS Code Insidersで開く 設定を構成することで、ターミナルで合字を有効にできます。

フォント機能設定

合字が有効な場合、font-feature-settings CSS プロパティの形式で詳細なフォント機能設定リストを指定することも可能です。これにより、合字のレンダリングをより細かく制御できます。例えば、標準の calt 合字を無効にして特定のフォントバリアントを有効にするには、"calt" off, "ss03" のように設定します。フォントがサポートするバリアントのリストについては、フォントのドキュメントを参照してください。

フォールバック合字

フォントが合字をサポートしているものの、VS Code が問題のフォントの解析をサポートしていない場合、GPUアクセラレーション を無効にするか、手動で結合するための文字シーケンスのリストを指定できます。

デフォルトでは、フォールバック合字はコーディングで使用される一般的な合字のリストです。このリストは terminal.integrated.fontLigatures.fallbackLigatures VS Codeで開く VS Code Insidersで開く 設定で微調整できます。例：

// Only use ligatures for `ff`, `fi` and `fl`
"terminal.integrated.fontLigatures.fallbackLigatures": [
    "ff",
    "fi",
    "fl"
]

GPUアクセラレーション

ターミナルには2種類のレンダラーがあり、それぞれにトレードオフがあります。

• WebGL レンダラー - 真のGPUアクセラレーション。
• DOM レンダラー - はるかに低速ですが互換性が高いフォールバックレンダラー。

WebGL レンダラーによる GPU アクセラレーションは、デフォルトでターミナルで有効になっています。これにより、CPU が各フレームのレンダリングに費やす時間が大幅に削減され、ターミナルの動作が高速化され、高 FPS で表示できるようになります。

デフォルトの terminal.integrated.gpuAcceleration VS Codeで開く VS Code Insidersで開く 値 auto は WebGL レンダラーを試行し、失敗した場合は DOM レンダラーにフォールバックします。Linux VM、WebGL をサポートしていないブラウザ、または古いドライバを搭載したマシンでは、WebGL が正しく動作しない場合があります。

カスタムグリフ

GPUアクセラレーション が有効な場合、フォントではなくカスタムレンダリングによってターミナルでの特定の文字の表示が向上します。以下の Unicode 範囲がサポートされています。

• 罫線素片（U+2500-U+257F）
• ブロック要素（U+2580-U+259F）
• 点字パターン（U+2800-U+28FF）
• Powerline シンボル（U+E0A0-U+E0D4、私用領域）
• 進捗インジケーター（U+EE00-U+EE0B、私用領域）
• Git ブランチシンボル（U+F5D0-U+F60D、私用領域）
• レガシーコンピューティング用シンボル（U+1FB00-U+1FBFF）

これは、構成されたフォントにこれらの文字が含まれている必要がないことを意味し、ピクセル単位で正確に描画され、適切な場合にはセル全体に引き伸ばされます。

上記範囲内でサポートされている約800文字のリストは以下の通りです。

この機能は、 terminal.integrated.customGlyphs VS Codeで開く VS Code Insidersで開く を false に設定することで無効にできます。

曖昧な幅のグリフの再スケーリング

一部の Unicode 文字は曖昧な幅を持っており、ターミナルのバックエンドとフロントエンドでサイズが一致しない場合があります。GPUアクセラレーション が有効でこの曖昧さが発生した場合、グリフは単一のセルに収まるように水平方向に再スケーリングされ、重なりを防ぎます。

例えば、以下の画像では、単一のセルに押し込められたローマ数字が表示されています。

この機能は、 terminal.integrated.rescaleOverlappingGlyphs VS Codeで開く VS Code Insidersで開く を false に設定することで無効にでき、その結果、重なったレンダリングが行われます。

プロンプトのカスタマイズ

ほとんどのシェルはターミナルプロファイルの広範なカスタマイズを許可しています。これは VS Code の外部で、通常は $PS1 変数の変更、$PROMPT_COMMAND の設定、またはプラグインのインストールによって行われます。

Starship や oh-my-posh のようなプロンプトは、Git のステータスなどを表示し、ほとんどのシェルで動作するため、初心者に適した選択肢です。

よくある質問

ターミナルに色付きの三角形や黒い長方形が表示されるのはなぜですか？

ターミナルは、一部の環境で GPU アクセラレーションレンダリングの問題が発生することがあります。例えば、テキストの代わりに大きな色付きの三角形が表示されることがあります。これは通常、ドライバや VM のグラフィックの問題が原因であり、Chromium でも同様のことが起こります。これらの問題に対処するには、code を --disable-gpu フラグを付けて起動するか、 terminal.integrated.gpuAcceleration VS Codeで開く VS Code Insidersで開く を off に設定してターミナルでの Canvas の使用を避けてください。詳細については GPUアクセラレーション セクションを参照してください。

ターミナルの色が正しくないのはなぜですか？

最小コントラスト比機能 により、期待通りに色が表示されない場合があります。これは以下で無効にできます。

"terminal.integrated.minimumContrastRatio": 1

なぜこれがデフォルトになっているのかという背景については、vscode#146406 で説明されています。