色差ΔE計算ツール（CIE76 / CIEDE2000）

「この2色、合ってる？」——その問いに数値で答える

色校正のやり取りで、こんな会話に覚えはないだろうか。「前回より少し青っぽくない？」「いや、同じはずだけど…」。並べて見れば違う気がするのに、いざ言葉にすると「なんとなく」しか出てこない。感覚での色合わせは、人によって基準がぶれるし、記録にも残らない。翌日になれば「昨日OKした色」がもう手元の記憶にしかない。

色差ΔE（デルタイー）は、この「なんとなく」を一本の数値に変える指標だ。2つの色がどれだけ離れているかを、CIE Lab* という色空間の上での距離として計算する。ΔE=0なら完全一致、値が大きいほど色が違う。このツールは2色のHEXコードを入れるだけで、ΔE76 と ΔE2000 という2方式の色差を同時に出し、その差がどれくらいなら「許容範囲」と言えるのかを判定する。感覚の議論を、数値の議論に置き換えるための道具だ。

なぜ作ったのか — 感覚の色合わせには限界がある

きっかけは、ブランドカラーの管理だった。Webでは #2E5FF5 と決まっているのに、印刷物やノベルティになると微妙に色が変わる。「ほぼ同じだから問題ない」と言う人と「明らかに違う」と言う人がいて、どちらが正しいのか誰も判定できない。両者とも嘘はついていない。人間の色の見えは、隣に置く色や照明、その日の体調でも変わるからだ。

調べていくうちに、製造業では当たり前のように色差ΔEで合否を決めていることを知った。塗料メーカーも繊維メーカーも印刷会社も、「ΔE2000で1.5以下なら合格」のように数値の許容差を持っている。感覚ではなく数値で線を引いているから、誰が見ても同じ判定になり、記録も残る。これだ、と思った。

ただ、既存のオンライン色差計算ツールには2つの不満があった。ひとつは、ΔE76（古い単純な式）しか出さないものが多いこと。ΔE76は青色域で実際の見えより大きな値を出す欠点があり、それを知らずに使うと「青なのに大きく外れている」と誤判定してしまう。もうひとつは、計算結果の数値だけ出して「で、これは合格なの？」の判断材料がないこと。

だから、現行標準の ΔE2000 を主役に据え、ΔE76 と並べて差を見せ、さらに知覚的な判定ラベルまで付けるツールにした。「数値が出る」だけでなく「数値の意味がわかる」ことを目指している。

色差ΔE とは何か — Lab* 表色系を第一原理から

色差 ΔE とは

色差ΔEの「Δ」は差分、「E」はドイツ語の Empfindung（感覚・知覚）の頭文字だ。つまりΔEは「知覚される色の違いの量」を意味する。定義はシンプルで、ある色空間の中で2色の座標がどれだけ離れているか、その距離がΔEになる。

ここで重要なのが「どの色空間で測るか」だ。HEXやRGBの数値をそのまま引き算してもダメで、たとえば #000000 と #0000FF（黒と青）のRGB差と、#00FF00 と #00FFFF（緑とシアン）のRGB差が同じ255だったとしても、人間が感じる違いの大きさは全然そろわない。RGBは「画面が光を出すための数値」であって「人がどう見えるか」とは別物だからだ。

Lab* 表色系と知覚均等空間

そこで使うのが CIE Lab*（エルスター・エースター・ビースター）という色空間だ。1976年にCIE（国際照明委員会）が定めたもので、3つの軸で色を表す。

• L*：明度。0が黒、100が白
• a*：赤(+)〜緑(−)の度合い
• b*：黄(+)〜青(−)の度合い

Lab* の狙いは「知覚均等（perceptually uniform）」であること。つまり、空間上で同じ距離だけ離れた2組の色は、人間にも同じくらい違って見える——という性質を持たせようとした設計だ。日常のたとえで言えば、地図の縮尺をそろえるようなもの。RGBが「東京で1cm＝1km、北海道で1cm＝10km」のようにバラバラな地図だとすると、Lab* は「どこでも1cm＝1km」にそろえた地図を目指している。だから2点間の直線距離（ΔE）が、そのまま「色の違いの大きさ」として意味を持つ。

実際にLabへ変換すると、たとえばブランド青 #2E5FF5 は L46.12 / a37.82 / b−79.33。bが大きくマイナスに振れているのが「強い青み」を表している。白 #FFFFFF なら aもbもほぼ0、L*が約100になる。詳しくは CIE Lab* 色空間（Wikipedia） を参照してほしい。

HEXからLab*への変換の流れ

このツールは入力されたHEXを、次の順序でLab*に変換している。

1. HEX → sRGB（0〜1に正規化）
2. sRGB → 線形RGB（ガンマ補正の解除）
3. 線形RGB → XYZ（D65光源の変換行列）
4. XYZ → Lab*（D65白色点で正規化）

ポイントは2番目の「線形化」。モニタのsRGB値は、人間の目の感度に合わせてガンマ補正がかかっている。これを c <= 0.04045 ? c/12.92 : ((c+0.055)/1.055)^2.4 で物理的な光の強さに戻してから、XYZ（人間の3種類の錐体の反応を表す中間色空間）を経由してLab*へ持っていく。この一連の変換を踏むことで、ようやく「知覚に近い距離」が測れるようになる。

ただし、Lab* の「知覚均等」は完璧ではない。特に青色域や彩度の高い領域では、距離が実際の見えとズレることがわかってきた。この欠点を補正したのが後述のΔE2000だ。

実務での重要性 — 色のズレが招く損失

色差を数値で管理しないと、何が起きるか。最もわかりやすいのが「ロット間の色ブレ」だ。同じ塗料・同じインクで作ったはずの製品でも、製造日や原料ロットが違うと色が微妙に変わる。これを目視だけで管理していると、「なんとなくOK」を繰り返すうちに少しずつ色がずれ、半年後には初回ロットと並べると明らかに違う、という事態になる。家具や外壁材のように後から買い足す商品では、これがクレームに直結する。

日本では、色差の測定・表示方法が JIS Z 8730「色の表示方法—物体色の色差」で規格化されている。ここに ΔE76 や ΔE2000(CIEDE2000) の計算法が定められており、企業間の品質保証はこの共通言語の上で行われる。「ΔE2000で1.0以下」と契約書に書いてあれば、納入側も検収側も同じ測色計と同じ式で判定できる。感覚で「合ってる/合ってない」を争う余地がなくなる。

許容差の目安も用途で大きく変わる。一般に、ΔE2000が1.0未満なら訓練された人でもほぼ識別できず、1.0〜2.0で熟練者が並べてようやく気づくレベル、2.0〜5.0で一般の人にも色差として知覚され、5.0以上は誰が見ても別の色だ。高級車の塗装やブランドロゴでは1.0前後の厳しい基準を、安価な雑貨では3.0程度を許容する、といった具合に線引きが分かれる。

逆に言えば、許容差を厳しくしすぎると歩留まりが落ちてコストが跳ね上がる。「どこまでのズレなら客が気づかず、商売として成立するか」を数値で決められること自体が、品質管理の出発点になる。数値で線を引けない現場は、過剰品質か品質クレームのどちらかに振れがちだ。

こんな場面で活躍する

DTP・色校正の現場では、初校と再校の色を並べて「指定どおりに直ったか」をΔEで確認できる。「青みを抜いてほしい」という曖昧な指示も、修正前後のΔEを見れば改善量が定量化できる。

塗装・補修の色合わせでは、調色した塗料が見本色にどれだけ近づいたかをチェックできる。ΔE2000が許容内に入るまで顔料を微調整する、という工程の判定に使える。

商品開発・品質検査では、量産品の色が標準見本（マスター）から外れていないかをロットごとに確認できる。出荷判定の客観的な根拠になる。

ブランド色の管理では、Web・印刷・グッズで使われている色がブランドガイドラインの基準色からどれだけ離れているかを一括で点検できる。#2E5FF5 に対して各媒体の実際の色がΔEいくつか、を並べれば逸脱が一目でわかる。

基本の使い方（3ステップ）

1. 基準となる色1のHEXを入力する（#は省略可、例 2E5FF5）。プリセットの「サンプルペア」から選んでもいい。
2. 比較したい色2のHEXを入力する。入力した瞬間に、各色のLab*値と色差ΔE76・ΔE2000が自動計算される。
3. ΔE2000のStatusCardで判定（ほぼ同一〜明確に異なる）を確認する。結果はコピーボタンで控えられるので、レビュー記録やチェックシートに貼れる。

すべてブラウザ内で完結し、入力した色のデータが外部に送信されることはない。

具体的な使用例 — 数値で見る色差の感覚

実際にツールへ入れたときの結果を見ていこう。「入力 → ΔE値 → 解釈」の3点セットで、ΔEの数値感覚をつかんでほしい。

ケース1：赤 vs 緑（最大級の色差）

入力：色1 #FF0000／色2 #00FF00

結果：ΔE76 = 170.565、ΔE2000 = 86.608、判定＝明確に異なる色（danger）。Lab* は赤が L53.24 / a80.09 / b67.20、緑が L87.73 / a−86.18 / b83.18。

解釈：純赤と純緑という、色相環で正反対に近い組み合わせ。ΔEは桁違いに大きく、「同じ色かどうか」を論じる以前のレベル。色差計算の振り幅の上限を感じるための基準ケースとして使える。

ケース2：ブランド青 vs 近似青（中程度の色差）

入力：色1 #2E5FF5／色2 #3A6BF0

結果：ΔE76 = 11.702、ΔE2000 = 3.909、判定＝知覚できる色差（caution）。Lab* は色1が L46.12 / a37.82 / b−79.33、色2が L49.13 / a29.58 / b−71.59。

解釈：ここが最も示唆的なケース。ΔE76=11.7 ＞ ΔE2000=3.9 と、両者の値が約3倍も食い違っている。これはΔE76が青色域で色差を過大評価する典型例だ。ΔE76だけを見れば「11も離れた別物」だが、ΔE2000で見れば「知覚できるが近い色」。青系のブランドカラーを扱うなら、ΔE76を鵜呑みにすると不要な作り直しを命じてしまう。色管理ではΔE2000を信じるべきだという教訓が、この1ケースに凝縮されている。

ケース3：グレー僅差（ロット差レベル）

入力：色1 #808080／色2 #828282

結果：ΔE76 = 0.783、ΔE2000 = 0.753、判定＝ほぼ同一（safe）。Lab* は色1が L53.59 / a0 / b0、色2が L54.37 / a0 / b0。

解釈：明度がほんの少し違うだけの無彩色ペア。ΔE2000が1.0を下回り、訓練された目でもほぼ識別できないレベル。製造ロット間で許容される「色ブレ」の現実的なラインがこのあたりだ。ΔE76とΔE2000がほぼ一致しているのも、無彩色では青色域のような補正が効かないため。

ケース4〜6：自分の手元の色で確かめる

数値の感覚をさらに掴むには、次のペアを実際にツールへ入れて確かめてほしい。ここでは独自に計算した数値を載せず、ツールの出力で確認する形にしている（暗算では正確なΔEは出せないため）。

• ケース4：白 #FFFFFF vs 白 #FFFFFF（完全一致）。ΔE=0 になることを確認する基準ケース。色を変えていないのにΔEが出たら入力ミスを疑える。
• ケース5：黒 #000000 vs 濃グレー #1A1A1A。暗部のわずかな差が、明度の低い領域でΔEとしてどう出るかを見る。
• ケース6：肌色 #F5C9A6 vs #EFC4A0。商品写真やプリントの肌色再現で問題になる、淡い色どうしの僅差。許容差を決める練習に向く。

実際のΔE値は、上記2色のHEXをツールに入力して確認してほしい。同じ「数値の小さい差」でも、無彩色・暗部・肌色で受ける印象が違うことが体感できるはずだ。

仕組み・アルゴリズム — ΔE76 と ΔE2000 の違い

2方式を併記する理由

色差の式は歴史的に何度も改良されてきた。代表的なのが ΔE76（CIE76）と ΔE2000（CIEDE2000）だ。本ツールが両方を出すのは、「単純な距離」と「知覚補正済みの距離」を見比べることで、色差の本質が理解できるからだ。

ΔE76 は Lab* 空間での単純なユークリッド距離。式は次のとおりで、直感的に理解しやすい。

deltaE76 = sqrt((L2 - L1)² + (a2 - a1)² + (b2 - b1)²)

ところがLab* の「知覚均等」は完全ではなく、特に彩度の高い青色域で距離が実際の見えより大きく出てしまう。ケース2がまさにそれで、ΔE76=11.7 に対し ΔE2000=3.9 と3倍近い開きが出た。

CIEDE2000 の補正

そこで CIE は2001年に CIEDE2000（CIE 142-2001、JIS Z 8730付属書）を定めた。基本は同じLab* 距離だが、明度・彩度・色相それぞれに重み関数（Sl, Sc, Sh）を掛け、さらに青色域のズレを補正する回転項 Rt を加える。最終式は次の形になる。

deltaE2000 = sqrt(
  (ΔL'/(kL·Sl))² +
  (ΔC'/(kC·Sc))² +
  (ΔH'/(kH·Sh))² +
  Rt · (ΔC'/(kC·Sc)) · (ΔH'/(kH·Sh))
)

計算手順は、(1) 各色のC*（彩度）を求めて平均し、(2) その平均彩度からG補正を計算してa*をa'に補正、(3) 補正後のC'とh'（色相角）を求め、(4) 明度差ΔL'・彩度差ΔC'・色相差ΔH'を出し、(5) 重み Sl・Sc・Sh と回転項 Rt を掛けて合成する。kL=kC=kH=1（標準観測条件）で計算している。手計算はほぼ不可能なため、Tool.tsx の calculate 関数に完全式を実装している。詳細は CIEDE2000（Wikipedia） を参照してほしい。

計算例で追う

ケース2の青ペアで流れを追う。まず両色をLab* に変換すると色1が(46.12, 37.82, −79.33)、色2が(49.13, 29.58, −71.59)。これをΔE76 にそのまま入れると、ΔL=3.01、Δa=−8.24、Δb=7.74 から sqrt(3.01²+8.24²+7.74²) ≒ 11.702 になる。

一方ΔE2000では、両色が高彩度の青であるため彩度・色相の重み Sc・Sh が大きくなり、さらに青色域の回転項 Rt が効いて、合成後の値は 3.909 まで圧縮される。同じ色の差を、片や11.7、片や3.9と評価する——この差こそが「単純距離」と「知覚補正」の違いそのものだ。色管理の現場で信頼すべきは、現行標準であるΔE2000の方になる。

コントラストチェッカーや色変換ツールとは何が違うのか

「色を扱うツール」とひとくくりにされがちだが、測っている軸がまるで別物だ。混同したまま使うと、見当違いの数字を根拠に色を判断してしまう。

まずコントラストチェッカーとの違い。/contrast-checker が測るのは2色の**輝度比（コントラスト比）**で、軸は「文字が背景の上で読めるか＝可読性」だ。WCAG の 4.5:1 や 3:1 という基準は、明るさの差が十分かどうかしか見ていない。だから青文字と赤文字のように「色相は全然違うのに明るさが近い」組み合わせは、コントラスト比では低く出る。逆に本ツールの ΔE は「2色がどれだけ違って見えるか」の総合距離なので、同じペアでも大きな値になる。可読性を見たいならコントラスト比、色が合っているかを見たいなら ΔE。測りたいものが違えば使うツールも違う。

次に色変換ツールとの違い。/munsell-hex-bridge はマンセル記号と HEX を相互変換する「表記の橋渡し」ツールで、1色の住所を別の座標系で言い換えるだけだ。/eyedropper-color-picker は画面上の色を吸い取って HEX を取り出す入口のツール。どちらも1色を扱う。本ツールは吸い取った2色や変換した2色を受け取り、その差を JIS Z 8730 の許容色差で合否判定するところまで踏み込む。色を取る・言い換えるのが前段なら、差を測って判断するのが本ツールの役割だ。

そしてもう一つの差別化が ΔE76 と ΔE2000 の併記。多くのオンライン色差ツールはどちらか片方しか出さない。本ツールは両方を並べて見せ、青色域などで両者がどれだけ食い違うかを体感できるようにした。「ΔE76 では大きいのに ΔE2000 では小さい」という乖離そのものが、色差を学ぶうえで一番おもしろい教材になる。

豆知識・色差をめぐる100年の試行錯誤

色の違いを数値化する試みは、20世紀前半までさかのぼる。当時よく使われたのが NBS単位（米国国家標準局が定めた単位）だ。「ちょうど見分けがつくかどうかの差」を1単位とする発想で、ΔE という考え方の祖先にあたる。CIE が 1976年に Lab* 表色系と CIE76 の色差式を定めたとき、その目盛りは「おおむね ΔE 1 が NBS 1単位に相当する」ように設計された。つまり ΔE=1 は「訓練された目がかろうじて見分けられる差」という、人間の知覚に根を持つ数字なのだ。

ところが CIE76 には大きな弱点があった。Lab* 空間を「どこでも均等にものさしが効く理想の空間」とみなして単純なユークリッド距離を測ったのだが、実際の人間の目はそうなっていない。同じ ΔE76=5 でも、灰色付近では「明確に違う」と感じるのに、鮮やかな青や緑の領域では「ほとんど同じ」にしか見えない。なぜ青で破綻するのか——それは Lab* 空間の青〜紫の領域が、知覚的にはギュッと詰まっているのに座標上では引き伸ばされているからだ。座標上の距離（ΔE76）を測ると、人が感じる差よりずっと大きな値が出てしまう。本ツールのプリセット「ブランド青 vs 近似青」がまさにこれで、ΔE76 が約 11.7 もあるのに ΔE2000 では約 3.9。人の目には ΔE2000 の方が実感に近い。

この歪みを補正するために生まれたのが CIEDE2000（CIE 142-2001 で標準化、JIS Z 8730 にも採録）だ。明度・彩度・色相それぞれに重み関数を掛け、青色域の暴れを抑える回転項（Rt）まで加えた。式は CIE76 とは比べものにならないほど複雑で、手計算はほぼ不可能。それでも採用されたのは、ひとえに「人の見えに合うから」。色差式の歴史は、きれいな幾何学（ユークリッド距離）を捨ててでも人間の感覚に寄り添ってきた歴史でもある。

参考: CIELAB色空間（Wikipedia）、Color difference - CIEDE2000（英語版Wikipedia）

色差を実務で使うときの Tips

Tip 1: 許容差は「用途」から逆算して決める。 万能のしきい値は存在しない。一般に、隣り合って比較される面（同一製品の左右パネルなど）は ΔE2000 ＜ 1 を狙い、離れて使われる部材は ΔE2000 ＜ 2〜3 でも許容されることが多い。広告印刷の色校正では 2〜3、塗装の調色現場では 1 前後を基準に置く例が多い。まず「誰が・どの距離で・並べて見るか」を決めてから数字を引くと迷わない。

Tip 2: 色管理の合否は必ず ΔE2000 で見る。 ΔE76 は直感的で計算も軽いが、青色域での過大評価がある。本ツールが ΔE76 と ΔE2000 の差が大きいときに警告を出すのはこのためだ。判定の最終根拠は ΔE2000 に統一しておくと、後でブレない。

Tip 3: 基準色は固定し、比較色だけ動かす。 ΔE2000 は厳密には対称でない計算を含むため、毎回「基準色＝マスターサンプル、比較色＝今回のロット」と役割を固定しておくと、記録した値どうしを安心して比べられる。本ツールの「色1（基準色）」を常にマスターに割り当てよう。

Tip 4: Lab の内訳も控えておく。* ΔE が大きいとき、原因が明度（L*）なのか色相（a*・b*）なのかで対処が変わる。本ツールは各色の Lab* を表示するので、差の出どころを見てから調整に入ると一発で寄せやすい。

Tip 5: モニタの色そのものを疑う。 同じ HEX でもモニタごとに見えは変わる。シビアな色合わせをする前に、ディスプレイのキャリブレーションを済ませておくと、画面上の判断と実測値のズレが減る。

よくある質問

まとめ

感覚に頼った「だいたい合ってる」を、ΔE という共通の物差しに置き換えるのがこのツールだ。2色の HEX を入れるだけで Lab*、ΔE76、ΔE2000、そして JIS Z 8730 ベースの許容判定までワンタップで出る。色管理の合否は ΔE2000 で、差の出どころは Lab* の内訳で——この2つを押さえれば、色合わせの会話がぐっと具体的になる。

画面の色を拾うなら /eyedropper-color-picker、マンセル記号と HEX を行き来するなら /munsell-hex-bridge、配色を試すなら /color-mix-sim、文字の可読性を確かめるなら /contrast-checker も合わせて使ってみて。色をめぐる作業がひととおりそろう。

気づいた点や追加してほしい機能があれば、お問い合わせから気軽に教えてほしい。