オープンソースのターミナルカラースキーム検索・実画面プレビュー・オンライン調色サイト Tintdex（URL：https://tintdex.afengim.com/ ）を制作・公開しました。コミュニティに点在する 2037種のターミナル配色 を統一パレット規格に集約し、ブラウザ上でShellやGit、プロセスモニター、複数言語のコードシンタックスハイライトを切り替えながら確認できるほか、個別カラーの微調整やOKLCH色空間での一括調色を行い、Ghostty、iTerm2、Kitty、Alacritty、WezTerm、Windows Terminalなど 16種類の設定ファイル としてワンクリックで書き出せます。
なぜターミナル配色サイトを自作したのか
ここ数年、ターミナルエミュレータやエディタを試行錯誤するなかで、iTerm2からAlacritty、WezTermへと移行し、最近はメイン環境をGhosttyに切り替えました。ターミナルやモニターを新調するたびに、配色の探し直しや移植で毎回同じ苦労を繰り返してきました。
最初にぶつかる壁は設定フォーマットの分断です。同じお気に入りのテーマでも、iTerm2では冗長なXML形式の.itermcolors、AlacrittyではTOML、WezTermではLuaテーブル、そしてGhosttyではプレーンテキストのキーバリュー形式になります。GitHubの各テーマリポジトリを見に行っても静止画のスクリーンショットが1〜2枚あるだけで、別のターミナルへ移すには自分で変換スクリプトを書くしかありませんでした。
さらに厄介なのが「見本スクリーンショットと実用時のギャップ」です。作者が厳選したneofetchのスクリーンショットでは美しく見えるテーマでも、いざ手元のターミナルに導入してgit diffやhtop、bun testを走らせてみると、color0（黒）やcolor8（明るい黒）に割り当てられたコメント文字が背景に沈んでほとんど読めなかったり、赤のエラー表示や黄色の警告がダーク背景上で眩しすぎて30分も画面を見続けられなかったりすることが珍しくありません。読めない1〜2色だけを直すために、設定ファイルを開いてHexカラーコードを手探りで書き換え、保存してターミナルをリロードする作業を何十回も往復することになります。
私が欲しかったのは、「ブラウザを開けばすぐ試せて、毎日実際に叩いているコマンド出力で見え方を確認でき、コントラスト不足の色を数値で教えてくれて、気になる色だけをその場で直して目的のターミナル設定ファイルを出力してくれるWebサイト」でした。既存のツールではどうしても帯に短し襷に長しだったため、自ら構築したのが Tintdex（https://tintdex.afengim.com/ ）です。
2037種のカラースキームと11種類の視覚スタイル分類
定番から隠れた名作まで網羅するため、TintdexはiTerm2 Color Schemes、Gogh、Tinted Theming (Base16 & Base24)、Alacritty Theme、Warp Themes、Kitty Themesという6つの主要オープンソースデータソースを統合・重複排除し、計 2037種のカラースキーム を収録しています。
リアルタイム描画される人気カラースキームのカード一覧
2000を超えるテーマを名前順だけで探すのは現実的ではありません。トップページやスキーム一覧（https://tintdex.afengim.com/schemes ）に並ぶカードは単なる静止画像ではなく、各パレットを使ってリアルタイムに描画されたミニターミナルウィンドウです。ディレクトリ一覧やgit statusの変更状態、テスト実行結果がそのまま表示されるため、一覧を眺めるだけで色温度やコントラストの傾向が直感的に把握できます。
背景明度・色温度・彩度に基づく11種類のスタイル分類
人気順だけでなく、背景の明度・彩度・色温度に基づいて全テーマを 11種類の視覚スタイル（https://tintdex.afengim.com/categories ）に分類しました。
- ダーク（1562種）とライト（475種）：夜間の暗所コーディングと日中の高輝度ディスプレイ作業の双方をカバーします。
- ピュアブラック OLED（250種）：背景が純黒またはほぼ純黒で構成され、MacBook Pro XDRやOLED外部モニターでベゼルと一体化した没入感を得られます。
- 高コントラスト（184種）とソフト（579種）：前者は本文と全ANSIカラーで高いWCAGコントラスト比を確保し、後者は明暗差を適度に抑えて長時間の作業による眼精疲労を和らげます。
- パステル（212種）、低彩度（225種）、ビビッド（256種）、ウォーム（228種）、クール（629種）、モノクローム（129種）：レトロなアンバーブラウン管風から北欧風のクールブルー、柔らかなパステル調まで、目の馴染みやすさから逆引きできます。
8つの実戦的なターミナル画面とWCAGコントラスト診断
任意のスキーム詳細ページを開くと、メイン領域にはインタラクティブなライブプレビュー環境が広がり、上部タブで ターミナル、コード、コントラスト の3つのビューを切り替えられます。
日常のCLI作業を再現する8つのターミナルシーンと対話型サンドボックス
ターミナルビュー では、日々の開発で頻繁に目にする 8つのコマンドラインシーン を用意しました。
- Shell：日常的な
ls -laのパーミッション・ディレクトリ配色とgit statusのブランチプロンプト。 - Git：実際の
git diffの追加・削除行ハイライトとコミットロググラフ。 - テスト：
bun testのパス（緑）・失敗（赤）・実行時間サマリー。 - ログ：タイムスタンプと
INFO/WARN/ERRORレベルを備えた構造化サーバーログ。 - プロセス：
htopスタイルのマルチコアCPU負荷バー、メモリ使用率、プロセステーブル。 - システム：
neofetch/fastfetch風のシステム情報とカラーブロック。 - カラーテスト：標準16色の前景色×背景色マトリクステーブル。
- 試してみる：ブラウザ上で直接
helpやls、git statusなどのコマンドを入力して応答を試せる対話型ターミナルサンドボックス。
全スロットを数値化するWCAG 2コントラスト比マトリクス
Shell画面だけでは気づきにくい配色の弱点も、コントラストビュー に切り替えると一目で判明します。Tintdexは前景色およびcolor0〜color15の全17色について、現在の背景色に対する WCAG 2コントラスト比 をリアルタイムに算出し、AA（4.5:1以上）やAAA（7.0:1以上）の基準を満たしているかを判定します。
たとえば定番の Catppuccin Mocha では、本文コントラスト比は11.34:1（AAA）、赤・緑・黄・青などの主要アクセントカラーもすべて7.08:1以上をクリアしています。しかしコントラストマトリクスを見ると、黒 · color0（#45475a）と明るい黒 · color8（#585b70）は背景#1e1e2eに対してそれぞれ1.80:1と2.46:1（「AA未満」と赤字表示）であることがわかります。もし利用中のCLIツールが補完候補や補足テキストにcolor8を使っている場合でも、設定を書き出す前に気づいてその場で明るく補正できます。
ブラウザ上での個別色調整とOKLCH知覚均等色空間チューニング
特定のスロットが見づらいときや、背景をもう少し深くしたい、赤色の彩度を落としたいといった場合も、設定ファイルをローカルに落として手探りで編集する必要はありません。右側の カスタマイズパネル からその場で色を作り込めます。
22個のカラースロットのピンポイント調色とリアルタイム判定
「カラー」タブには、背景色・前景色・カーソル・カーソル文字・選択範囲・選択文字、そして標準のcolor0〜color15が計22個の円形スウォッチとして並んでいます。任意のスウォッチ（たとえば Tokyo Night の赤 · color1）をクリックすると、カラーピッカーのドラッグ操作やHexコードの直接入力が可能です。
ピッカーを動かすたびに、左側のターミナル画面、コードハイライト、そしてピッカー下部の 対背景WCAGコントラスト比 がリアルタイムに更新されます。暗すぎるスロットがあれば、下部の数値を見ながら4.5:1（AA）や7.0:1（AAA）を超えるまで引き上げるだけで済み、いつでもワンクリックで元の色に戻せます。
OKLCH色空間による色相回転と複数言語のコードハイライト
テーマ全体の明暗バランスやコントラスト設計は気に入っているものの、全体の雰囲気だけを少し変えたい——たとえば紫寄りの Rosé Pine を少しクールな青緑や温かみのあるアンバー寄りに振りたい、というケースもあります。
従来のHSL色空間で色相（Hue）を一括回転させると、人間の目の感度特性と合わないため「黄色に振ると急に眩しくなり、青に振ると一気に暗く沈む」という破綻が起きがちです。そこでTintdexの「調整」タブでは、すべての演算を OKLCH知覚均等色空間 上で行っています。
- 色相シフト（
-180°〜+180°）：パレット全体の色相を回転させても各スロットの知覚明度（Lightness）が厳密に維持されるため、シンタックスハイライトの階層や視認性を損なわずに別系統のカラーテーマへ変換できます。 - 彩度・明度・コントラストスライダー：鮮やかなテーマを落ち着いた低彩度トーンに抑えたり、暗部を一括で持ち上げたりでき、スライダーのダブルクリックで即座に初期値へ戻せます。
- 表示環境のシミュレーション：「表示」タブでは、等幅フォント（
JetBrains Monoなど）、フォントサイズ、行間、太字への明るい色の適用、カーソル点滅の有無を切り替えられるほか、80×24、100×30、120×40といったウィンドウサイズ別の表示密度も検証できます。
色を調整したあとは、右上の 共有 ボタンからカスタムパレット全体をエンコードしたURLをコピーでき、ブックマークやチーム内での共有も簡単です。
代表的な人気カラースキーム6選と複数テーマの横並び比較
どのテーマから見るか迷ったときは、まずコミュニティで定評のある代表的なパレットを試し、比較ワークベンチで並べて見比べるのがおすすめです。
長時間の作業でも目が疲れにくい代表的な6テーマ
パステル、クールダーク、低彩度パイン、レトロウォーム、和風ダーク、日中向けライトの6系統から代表的なスキームをまとめました。リンクから直接プレビューと調色を試せます。
| テーマ名 | スタイルの特徴 | 背景色 / 前景色 | 本文コントラスト比 | オンラインプレビュー・調色URL |
|---|---|---|---|---|
| Catppuccin Mocha | 柔らかなパステルダークの定番。彩り豊かで目が疲れにくい | #1e1e2e / #cdd6f4 |
11.34:1 (AAA) |
https://tintdex.afengim.com/schemes/catppuccin-mocha |
| Tokyo Night | 深夜の青紫を基調としたクール系。暗所での長時間作業に最適 | #1a1b26 / #a9b1d6 |
8.10:1 (AAA) |
https://tintdex.afengim.com/schemes/tokyo-night |
| Rosé Pine | 低彩度のパイングレーとローズゴールドが調和した上品な配色 | #191724 / #e0def4 |
13.39:1 (AAA) |
https://tintdex.afengim.com/schemes/rose-pine |
| Gruvbox Dark | 温かみのあるレトロブラウン基調。高い識別性を誇る暖色系の代表格 | #282828 / #ebdbb2 |
10.8:1 (AAA) |
https://tintdex.afengim.com/schemes/gruvbox-dark |
| Kanagawa Wave | 葛飾北斎『神奈川沖浪裏』に着想を得た落ち着きのある和風ダーク | #1f1f28 / #dcd7ba |
11.3:1 (AAA) |
https://tintdex.afengim.com/schemes/kanagawa-wave |
| Catppuccin Latte | 日中の明るい部屋でも読みやすいウォームホワイト系ライトテーマ | #eff1f5 / #4c4f69 |
7.1:1 (AAA) |
https://tintdex.afengim.com/schemes/catppuccin-latte |
最大4テーマの横並び比較とハイブリッド合成ワークベンチ
複数の候補で迷ったときは、カラースキーム比較ワークベンチ（https://tintdex.afengim.com/compare ）が便利です。最大 4つのテーマ を横並びで比較でき、「Catppuccin 4フレーバー」「Tokyo Night と One Dark」「Dracula と Nord」「Gruvbox ダーク＆ライト」のクイックプリセットも備えています。
比較画面では各スロットのカラーコード差や実画面、コントラスト指標を見比べられるだけでなく、ミックス作成 を押して「Tokyo Nightの背景色にCatppuccin Mochaのアクセントカラーを組み合わせる」といったハイブリッドテーマの合成も可能です。
単一パレットから16種類のターミナル・開発ツール設定を即時出力
既存のスキームをそのまま使う場合も、個別調整やOKLCHスライダーで自分好みに仕上げた場合も、ページ下部の 設定ファイル出力セクション から変換作業なしで 16種類のフォーマット を即座に取得できます。
11種のターミナル・2種のエディタ・Webスタイルへのリアルタイム出力
出力フォーマットは用途別に4つのカテゴリーに分かれており、左側のタブをクリックすると対応する設定コードが即座に切り替わります。
- 11種類の主要ターミナルエミュレータ：
Ghostty、iTerm2、Kitty、Alacritty、WezTerm、Windows Terminal、Warp、foot、Rio、XFCE4 Terminal、Xresources（各タブの上部にはローカル設定ファイルの配置パス手順も記載しており、ターミナル別一覧ページ https://tintdex.afengim.com/terminals からも探せます）。 - 2種類のコードエディタ内蔵ターミナル：
VS Code ターミナル（workbench.colorCustomizationsのJSONスニペット）およびZed ターミナル。 - 3種類のWebフロントエンド・汎用データ形式：
CSS 変数、Tailwind CSS v4（@theme構文）、標準JSON。
設定ファイルの ダウンロード や コピー に加え、プロンプトをコピー ボタンも用意しました。まだリストにないマイナーなターミナルやTmuxステータスバー、Neovimプラグイン、自作TUIツールなどに適用したい場合、このボタンを押せば全スロットの正確なHexマッピングを含む構造化プロンプトがコピーされ、そのままAIに渡すだけで目的のツール向け設定を生成できます。
サイトは日本語・簡体字中国語・繁体字中国語・英語などの多言語切り替えに対応しています。ぜひ https://tintdex.afengim.com/ にアクセスして、目に馴染む一着を見つけるか、自分だけのターミナルテーマを作ってみてください。
