/theme(テーマ)

スラッシュコマンド
/theme
テーマ
Claude Codeが画面に出す文字・枠線・コードブロックの配色(テーマ)を、7種類のプリセット(auto / dark / light / light-daltonized / dark-daltonized / light-ansi / dark-ansi)から選んで切り替えるスラッシュコマンド。auto を選ぶと OS の外観設定に追従する。コマンドだけ叩くと選択メニューが開く。

Claude Codeを起動した直後、画面の文字色や背景の見え方が「目に入りづらい」と思った人向け

Claude Codeを起動したら文字と背景のコントラストが合わずコードブロックが読みづらい時、明るい部屋から暗い部屋へ作業環境を変えた時、色覚特性に合わせてdiff表示の追加・削除を区別しやすい配色に変えたい時に叩く。auto を選べばターミナルの明暗を自動検知して OS の外観変更にテーマが追従するので、昼夜で部屋の明るさが変わる人はこれが手っ取り早い。コマンドだけ打つと選択メニューが開いて矢印キーで選べる。

Claude Code を起動した直後、画面の文字色が背景に潰れて読めない、コードブロックの中身が灰色一色に見える、追加された行と削除された行の区別がつかない。こういう「見にくさ」を1コマンドで切り替えるのが /theme です。

白背景のターミナルなのに Claude Code 側が暗い配色のまま起動してしまうケースがいちばん多い。文字と背景のコントラストが合っていないだけなので、設定を直せば一瞬で解決します。

噛み砕くと

家電の表示パネルに「明るさ自動/室内モード/屋外モード」の切り替えがあるみたいなものです。Claude Code 自身が画面に出す文字や枠線の色を、7種類の配色セットから選んで切り替える指示が /theme

選んだ配色は次に起動した時もそのまま残ります。毎回叩き直す必要はないです。

大事な前提:ターミナル本体の背景色とは別の話

ここを混同すると沼ります。/theme が変えるのは「Claude Code が描画する文字・枠・コードブロックの配色」だけ。背景色そのものはターミナル本体側の設定で決まっています。

つまり、ターミナル本体が黒背景のまま Claude Code を「light」テーマにすると、薄い灰色の文字が黒背景に乗って逆に読みづらくなる、という事故が起きます。両方そろえる必要があります。

「白背景のターミナルでコードブロックが読めない」を例に、実際の手順を見る

具体的なシーンを置きます。Macで標準のターミナル.appを開き、白背景・黒文字のプロファイルにしている状態で claude を起動した。Claude が答えてくれた中のコードブロックが灰色一色に潰れて、中身がほぼ見えない。これを直していきます。

ステップ1: そのまま /theme と打つ

会話の入力欄にスラッシュから打ちます。

> /theme

後ろに何も書き足さなくていいです。Enter を押すと選択メニューが画面下に開きます。

ステップ2: 矢印キーで選択肢を見る

選択肢は7つ並んでいます。

  auto
  dark
  light
  light-daltonized
  dark-daltonized
  light-ansi
  dark-ansi

上下の矢印キーでカーソルを動かすと、選んだ瞬間に画面の色がプレビューで切り替わります。確定する前に「これが見やすいか」をその場で確認できる仕組み。便利です。

先頭の auto を選ぶと、ターミナルの明暗を自動で読み取って、OS の外観変更に追従してテーマを切り替えてくれます。Macで「ダークモード/ライトモード」を時間帯で自動切替している人や、システム設定をその日の気分で変える人にとっては、この一択でだいたい片付くようになっています。

ステップ3: light を選んで Enter

白背景のターミナルなので、文字が黒寄りになる「light」をカーソルで合わせて Enter。これで確定します。

コードブロックが白背景に黒文字+構文に応じた色付きでくっきり見えるようになりました。diff の追加行は緑、削除行は赤で表示されます。

ステップ4: 設定が保存されているか確認する

テーマ設定は ~/.claude/settings.json という設定ファイルに書き込まれます。中を見ると以下の行が増えているはず。

{
  "theme": "light"
}

ここに書かれている限り、次に claude を起動した時も自動的に light テーマで立ち上がります。毎回 /theme を叩き直す必要はないです。auto を選んだ場合は "theme": "auto" と記録され、起動のたびにOSの外観設定を見にいって明暗を判断してくれます。

ステップ5: ここで初心者がやりがちな勘違い

「light テーマにしたのに、まだ画面の大部分が黒い」と困るパターン。これは Claude Code 側のテーマは light に切り替わっているけど、ターミナル本体の背景がまだ黒という状態です。

ターミナル本体側のプロファイル設定から白背景のものに切り替えてください。両方そろってはじめて見やすくなります。

ステップ6: 色覚タイプに合わせたテーマもある

diff の追加・削除を緑と赤で見分けにくいと感じる人向けに、配色を調整した light-daltonizeddark-daltonized が用意されています。daltonized は赤緑の見分けが苦手な色覚特性に合わせた配色のこと。

赤と緑の代わりに、青系とオレンジ系で追加・削除を区別する設計になっています。心当たりがあれば一度試す価値あり。

このプリセット7種に加えて、~/.claude/themes/ に自分で書いた配色ファイルを置いたり、テーマを提供するプラグインを入れたりすると、選択肢にカスタムテーマも並ぶ仕組みになっています。標準の7つで満足できなくなった時の逃げ道として覚えておけば十分。

つまり /theme は何をしてくれるのか

  • やってくれる: Claude Code 全体の配色を7種類のプリセット(auto / dark / light / light-daltonized / dark-daltonized / light-ansi / dark-ansi)から切り替える。auto を選べば OS の外観設定に追従して明暗が自動で切り替わる。プロンプト、応答文、コードブロック、diff表示、画面下のステータスバー、選択ダイアログまで含めて切り替わる。設定は次回起動以降も維持される
  • やってくれない: ターミナル本体の背景色は変わらない。文字フォントやサイズの変更もこのコマンドの守備範囲外。記事や応答ログの「過去の表示済み行」は色換えされない
  • 意味が薄い場面: ターミナル本体の配色が極端な色になっている環境では、Claude Code 側のテーマをどう変えても土台が崩れているので焼け石に水。先にターミナルのプロファイルを整えるのが先

使いどころ3シナリオ

シナリオ1: 「料理ブログを始める」プロジェクトを白背景ターミナルで触り始めた初日

Macでターミナル.appを白背景・黒文字のプロファイルで開き、料理ブログの雛形を Claude Code に作らせ始めた。応答に出てくるレシピのコードサンプルが灰色に潰れて、どこが見出しでどこが本文か区別がつかない。

/theme で light に切り替えると、HTMLタグの色、CSSプロパティの色、文字列リテラルの色が個別に色分けされてプレビューしやすくなります。コーディング作業の体感速度がだいぶ変わるところ。

シナリオ2: 「家計簿アプリ」を作ってる途中、diff の追加・削除が見分けにくいと気づいた

家計簿アプリの計算ロジックを Claude Code に書き直してもらった時、変更後のコードが diff 表示で出てきた。ただ、追加された行と削除された行の区別が自分の色覚ではほぼつかない。

/theme から light-daltonized を選ぶと、追加行は青系、削除行はオレンジ系で表示されるようになります。色だけで意味が伝わる UI を諦めなくていいのは助かります。

シナリオ3: OSSを自分のパソコンに持ってきた直後、昼夜で部屋の明るさが変わる作業環境

昼間は明るい部屋で作業して、夜になると部屋を暗くするタイプの人。light のままだと夜にまぶしくて目が痛いし、dark のままだと昼間にコントラストが弱くて読みづらい。

この場合は /theme から auto を選ぶのが手っ取り早いです。Macのシステム外観を「自動」にしておけば、時間帯で OS が勝手にダーク/ライトを切り替え、それに合わせて Claude Code のテーマも追従します。設定は ~/.claude/settings.json"theme": "auto" として書き込まれるので、毎晩切り替える手間が消えるところ。

初心者が踏みやすい落とし穴

  • ターミナル本体の背景色は /theme では変わらない。Claude Code が描画する部分の色しか変わらないので、土台のターミナルが黒背景なら light テーマでも結局見づらい。両方そろえること
  • auto を選んでもターミナル本体の背景は追従しない。auto はあくまで Claude Code 側のテーマが OS の外観設定に追従する仕組みで、ターミナルアプリ側のプロファイルは別途自分で「OSに追従」設定にしないといけない。Mac標準のターミナル.appにはこの設定があるけれど、iTerm2など他アプリの場合はアプリごとに設定方法が違う
  • 選択肢の -ansi 付きテーマはターミナル設定を尊重するモードlight-ansidark-ansi はテーマ自体が固有の色を持たず、ターミナルアプリ側で定義してあるANSIカラーを使って描画する。配色を細かく自作している上級者向けで、初期状態の人が選ぶと意図しない色になることが多い
  • 表示済みの古い行は色換えされないことがある。テーマを切り替えた瞬間から新しく出る行は新色になるけど、画面に残っている過去ログは描画し直されないままのことがある。新しい応答が1つ来れば違いが分かるので、1つメッセージを送ってみるのが早い
  • 設定ファイルに直接書いても反映される~/.claude/settings.json"theme": "light" と書いて起動しても同じ結果になる(auto を選んだ場合は "theme": "auto" と記録される)。チームで設定を共有する時はこっちのほうが確実です
  • daltonized と ansi は別物。名前が似てるけど用途が違う。daltonized は色覚特性向けの配色プリセット、ansi はターミナル側の配色定義を流用するモード。混同して選ぶと「思ってた色と違う」になる
  • テーマを変えても文字フォント・サイズは変わらない。文字が小さくて読みづらい場合は /theme ではなくターミナル本体のフォント設定を触る話。間違ったコマンドを延々叩いても解決しません
  • 設定が保存されているか不安なら settings.json を覗くcat ~/.claude/settings.json でファイルの中身を表示すれば、"theme": "light""theme": "auto" のような行が入っているか確認できる。入っていなければ書き込みに失敗している可能性があるので、もう一度 /theme を叩き直す
  • ANSIカラーという用語が分からないなら ansi 系は選ばない。light-ansi や dark-ansi はターミナルアプリ側で「Black」「Red」「Green」などの名前で配色を自分で登録している人向け。普通は auto / light / dark のどれかで十分です

書き方

/theme

やってみるとこうなる

入力

/theme

出力例

(選択メニューが開く)
  auto
  dark
> light
  light-daltonized
  dark-daltonized
  light-ansi
  dark-ansi

矢印キーで選択肢にカーソルを合わせるとプレビューで色が即時切り替わり、Enterで確定する。auto はターミナルの明暗を自動検知して OS の外観変更に追従する。確定後は ~/.claude/settings.json の "theme" フィールドに保存され、次回起動時も自動的に同じテーマで立ち上がる。

このページに出てきた言葉

テーマ
画面に出す文字や枠の「色のセット」のこと。Claude Codeでは7種類のプリセットから選ぶ
auto
ターミナルの明暗を自動検知して、OS の外観設定(ダークモード/ライトモード)の変更にテーマを追従させるモード。<code>"theme": "auto"</code> としてsettings.jsonに記録される
ターミナル
黒い画面で文字のコマンドを打ち込む画面。Macだと「ターミナル」アプリ、Windowsだと「コマンドプロンプト」「PowerShell」など
diff
ファイルの変更前・変更後を並べて、追加された行と削除された行を色で示す表示。Claude Codeがコードを書き換える時に追加を緑、削除を赤で見せてくる、あれ
daltonized
赤緑の色の差を見分けにくい色覚特性の人にも区別できるように調整された配色。light-daltonized / dark-daltonizedの2種類が用意されている
ANSIカラー
ターミナルアプリ側で「Black」「Red」「Green」などの名前で登録された配色定義。<code>-ansi</code> 付きのテーマはこの定義を流用して描画する
~/.claude/settings.json
Claude Codeが自分の設定を保存しているファイル。テーマを変えると <code>"theme": "light"</code> や <code>"theme": "auto"</code> のような行がここに書き込まれる
~/.claude/themes/
自分でテーマを書いて置けるフォルダ。ここに配色ファイルを置くか、テーマ提供プラグインを入れると、選択メニューにカスタムテーマも並ぶ

関連項目

公式ドキュメント

https://code.claude.com/docs/en/slash-commands

-

← 戻る