色距離 (ΔE)
ΔE（デルタ E）は「これらの 2 つの色が人間の目にどれくらい違って見えるか」を単一の数値で表現する標準的な方法。CIEDE2000 は現代の参考 — 約 1 未満は通常区別不可能、約 2 未満は非常に近い、10 前後は明らかに異なる、50+ は色相環の反対側。CIE76 はレガシー用、RGB 距離は素朴なベースライン。
- ΔE 200031.36
- ΔE 7667.18
- RGB 距離85.15
知覚
異なる — 明確に別の色。
ΔE は D65 参照白を使用した CIE Lab で計算 — すべてのモダンなカラーマネジメントツールが使う同じ慣習。
使い方
- 2 つの HEX 色を入力するか、スウォッチで選択。
- CIEDE2000 を読む — それが信頼できる知覚的な数値。
- 下の注釈が値を定性的な記述にマップ。
よくある質問
- ΔE76 と ΔE2000 はなぜ違う？
- ΔE76 は Lab 空間でのストレートなユークリッド距離 — 計算は簡単だが青の領域で歪む。CIEDE2000 は色相、彩度、明度の感度差を補正する。モダンなカラーマネジメントソフトウェア（Pantone、X-Rite、Adobe）は CIEDE2000 を報告する。
- 知覚可能な最小差は？
- 管理された視聴条件下では ΔE 1 程度。実際には — 悪いモニター、周囲光、並列 vs 記憶比較 — 通常 ΔE 2〜3 で気付き始める。
- 仕様書にはどの式を書くべきですか?
- 規格や既存の工程に縛られていないかぎり、CIEDE2000です。1976年の式が差を見誤る領域、とくに青系や彩度の高い色を補正しており、今日使われる許容値もこの式を前提にしています。どちらを使うにせよ、数値のとなりに式の名前を書いてください。許容値2は、二つの式で同じ意味にはなりません。
- ΔEが大きければ文字は読みやすいということですか?
- いいえ、測っているものが違います。読みやすさは相対輝度を比べるコントラスト比で決まり、ΔEは知覚される色の違いを測ります。色相が大きく違っていても明るさが同じくらいなら、コントラストの要件を満たしません。読みやすさはコントラスト判定で、色合わせはΔEで確かめてください。
関連ツール
OKLCH カラーピッカー
知覚的に均一な OKLCH 空間（明度・彩度・色相）で色を選ぶ — そして各選択が sRGB ディスプレイ色域内に収まるかを確認。
CSS color-mix() プレビュー (補間空間の比較)
モダン CSS の color-mix() 関数が補間空間 (srgb, hsl, oklch, lab, lch, hwb, oklab, srgb-linear) によって 2 色をどう異なる結果で混ぜるかを並べて比較 — ライブスウォッチ、計算済み hex、各空間のフルグラデーション、コピー可能な CSS 付き。
カラー名検索
任意のhex/RGB色に最も近いCSS・Tailwind・XKCD色名をOKLabの知覚距離で順位付け表示。
CSS ブレンドモード シミュレーター
W3C コンポジティング仕様の 16 種類の mix-blend-mode(multiply·screen·overlay·soft-light·hue·color·luminosity など)を 2 色に適用した結果を一覧比較し、各モードの CSS スニペットをコピーできます。
色の明るさ比較 (HSL vs Lab L* vs WCAG vs HSP)
HSL 明度・HSV 値・WCAG 相対輝度(LRV)・CIE Lab L*(知覚明度)・Rec. 709 ルーマ・HSP 知覚明度・素朴な (R+G+B)/3 など 7 種の明るさ指標を、1 色または 2 色について同時に比較。「より明るく見えるはず」の色がなぜ暗く感じられるか即座に把握できます。
カラーコントラスト チェッカー
文字／背景のコントラストを WCAG AA・AAA 基準でチェック。