Delta E 計算器是一種工具，它會根據標準化的知覺色差公式，回傳一個單一數值來描述兩個顏色之間的距離。色彩差異計算器採用 CIEDE2000（現代預設標準），讀取兩個不透明的六位數 sRGB HEX 值（例如 #1A6FB2 與 #2B80C3），將每個值透過 D65 XYZ 進行轉換，並從 D65 至 D50 套用 Bradford 色適應變換，接著產生 CIELAB 座標，最後執行 kL、kC 與 kH 均設為 1 的 CIEDE2000 加權計算。輸出是一個對稱且可重現的數字：零代表兩者完全相同，數值越大代表公式定義的差距越大。只要輸入相同，每次都會得到相同的結果，僅受限於浮點顯示的四捨五入，因為從 sRGB 轉換到最終加權的每一步都是確定性的。由於計算純粹是對您所提供座標的算術運算，它無法證明兩個實體樣本是否相符；最適合將其視為設計權杖修訂、取樣影像像素、品保註記與 CSS 色彩程式碼審查的文件化、可重複的比較輔助工具。
工具接受與回傳的內容
色彩差異計算器刻意嚴格限制輸入內容，這是維持結果明確無歧義的唯一方式。兩個輸入都必須是不透明且以 # 開頭的六位數 sRGB HEX 值。三位數簡寫（如 #1AB）、帶有 alpha 通道的 HEX（如 #1A6FB280）、命名的 CSS 色彩、display-p3 函式值，以及任何長度錯誤或包含非十六進位字元的字串，都會在數學運算執行前遭到拒絕，且在這些情況下不會顯示任何結果。這樣的拒絕政策是有意為之：上述每種替代格式都隱含了透明度、不同的色彩空間，或關於解析方式的假設，而這項工具拒絕為您代為決定。如果透明度在您的設計中很重要，請先將兩個顏色在相同的已知背景上進行合成，再比較所產生之不透明 sRGB 值；半透明的前景並非一個獨立的不透明 sRGB 顏色。
| 輸入格式 | 範例 | 結果 |
|---|---|---|
| 不透明六位數 sRGB HEX | #1A6FB2 | 接受 |
| 三位數簡寫 | #1AB | 拒絕 |
| 含 alpha 通道的八位數 HEX | #1A6FB2C0 | 拒絕 |
| 缺少前導 # | 1A6FB2 | 拒絕 |
| 命名的 CSS 色彩 | royalblue | 拒絕 |
| display-p3 函式 | color(display-p3 0.1 0.4 0.7) | 拒絕 |
| 空值 | (空白) | 拒絕 |
一旦兩個值都通過驗證，計算器會回傳三項內容：您輸入的兩個原始 HEX 值、用於差異計算的每個顏色之 D50 CIELAB L*、a*、b*，以及一個總結知覺差距的單一 Delta E 2000 數值。不會上傳任何資料；每一步都在您開啟工具的裝置上的瀏覽器中執行。
輸入兩個 HEX 色彩並讀取 Delta E 數值
- 在任何現代的桌面或行動瀏覽器中開啟色彩差異計算器。無需帳號、無需安裝、無需上傳 — 每一步都在網頁中於本地端執行。
- 在第一個欄位中，輸入一個不透明的六位數 sRGB HEX 色彩（含前導 #）。在第二個欄位中重複輸入另一個不透明的六位數 sRGB HEX 色彩。
- 選擇「比較色彩」。工具會驗證兩個輸入，對任何格式錯誤的字串顯示明確的錯誤訊息，僅在兩個欄位皆正確無誤時才會繼續執行。
- 閱讀輸出面板。您會看到兩個原始 HEX 值、每個顏色的 D50 CIELAB L*、a*、b* 三組數值，以及一個總結知覺差距的單一 Delta E 2000 數值。
- 複製或擷取螢幕畫面，記錄 HEX 值、CIELAB 三組數值與 Delta E 數值，並附上關於您的檢視或製作情境的註記 — 螢幕校色、環境光源，以及您的品牌或印刷製程所要求的容差 — 以便日後重做相同比較的人擁有相同的輸入與意圖。
轉換路徑如何運作
您讀到的數值，其可信度取決於產生它的轉換過程。本實作遵循 CSS Color 4 範例路徑，這是公開記錄的瀏覽器色彩運算參考。每個 sRGB 通道值首先會從 0–255 正規化至 0 到 1 的範圍，接著使用 sRGB 轉換函式進行線性化：小於或等於 0.04045 的通道會除以 12.92，高於該閾值的通道則套用 gamma 曲線 ((c + 0.055) / 1.055) 的 2.4 次方。接著將三個線性通道乘以對應於 D65 參考光源（D65 是大多數 sRGB 顯示器所校準的光源）的 CIE XYZ 矩陣。
由於 CIELAB 是相對於 D50 而非 D65 所定義的，接著會使用 Bradford 變換對 XYZ 值進行色適應，該變換模型化典型人類視覺系統重新映射白點的方式。經過適應後的 D50 XYZ 值會代入標準 CIELAB 公式，產生代表明度的 L*、代表綠–紅軸的 a*，以及代表藍–黃軸的 b*。結果面板中顯示的 CIELAB 三組數值會為了可讀性而進行四捨五入，但未經四捨五入的數值會繼續進入差異公式，因此顯示的四捨五入不會影響最終分數。
CIEDE2000 不僅僅是 CIELAB 中的簡單歐幾里得距離。它會在接近中性色時調整 a* 軸、正確處理跨越 360°/0° 邊界的色相角度、對明度、彩度與色相的差異分別加權，並加入一個在高飽和藍色區域中能改善一致性的旋轉項。在預設權重 kL = kC = kH = 1 下，比較 A 與 B 會得到與比較 B 與 A 相同的數值，這在結果看起來出乎意料時是一個實用的健全性檢查。如需完整方法、參考矩陣與範例原始碼，請參閱W3C CSS Color 4 轉換與 DeltaE2000 範例程式碼。
實作範例：從 sRGB 到線性的一個通道
為了具體說明第一個轉換步驟，以 #808080（中性中灰）的綠色通道為例。十六進位數字 80 等於 128，因此正規化後的 sRGB 值為 128 / 255 ≈ 0.50196。該值高於 0.04045 閾值，因此線性值為 ((0.50196 + 0.055) / 1.055)^2.4 = (0.52792)^2.4 ≈ 0.2159。這個線性值才是 CIELAB 管線實際使用的數值；原始的 0.50196 並不會直接代入 XYZ 矩陣。藍色與紅色通道會經過完全相同的步驟，必須在這三個通道皆完成線性化之後，D65 XYZ 矩陣才會將它們結合在一起。至於驗證後的 Delta E 數值本身，請在工具中實際執行該組配對 — 完整的 CIEDE2000 加權包含相當多的項（明度、彩度、色相，以及藍色區域的旋轉項），徒手計算容易產生算術錯誤。
該數值能證明與不能證明的事
Delta E 2000 數值是公式的輸出，而非知覺的裁決。較大的數字代表在文件化的假設下計算出的距離較大；較小的數字代表兩個 CIELAB 三組數值在該加權意義下較為接近。相同的輸入必定回傳零，相同的輸入組合必定回傳相同的數字，僅受限於浮點顯示的四捨五入，因為整個管線是確定性的。本實作也會針對 Sharma、Wu 與 Dalal 補充資料集中的八組對正負號敏感之參考配對進行測試，因此對於色相邊界處理或加權項的修改，無法僅通過簡單的相同色案例 — 請參閱Sharma, Wu and Dalal CIEDE2000 實作資料，取得用於驗證任何實作的參考數值。
該數值無法證明的是：兩份印刷樣本、兩個塗抹色塊，或兩個拍攝色塊，會在每位觀察者眼中看起來相同。真實世界的色彩比對取決於基底材質、油墨或顏料、房間內的光源、觀察者的視力、周圍的顏色，以及製作流程所接受的容差。顯示在結果旁的兩個色彩色塊僅為視覺參考，並非色彩測量證據 — 瀏覽器渲染、螢幕色域、色彩設定檔、亮度與校色都會影響螢幕上的顯示。
Delta E 數值對工作流程有何助益
在合理的預期下使用，Delta E 2000 數值是為一對顏色附加可重現分數最簡潔的方式之一。設計權杖修訂可獲得一份文件化的指標。取樣的影像像素可在候選色塊之間取得可比較的分數。品保註記可在 HEX 配對與檢視情境上附加一個明確的數字。這些用途都無法取代在實際生產表面上進行校色測量，但它們都能從一個「不會因觀看螢幕者不同而異」的單一數值中獲益。
| 工作流程 | 計算器能為您提供什麼 | 您仍需要什麼 |
|---|---|---|
| 設計權杖修訂（CSS、設計系統） | 一個可重現的數字，用以記錄新權杖與舊權杖之間的接近程度 | 在已校色螢幕上進行視覺審查 |
| 取樣的影像像素（調色盤萃取） | 從相片中為候選色塊產生可比較的評分 | 確認取樣時該相片已進行色彩管理 |
| 品保註記與變更紀錄 | 一個附加在 HEX 配對與檢視情境上的明確數值 | 關於裝置、光源與所採用容差的情境說明 |
| 印刷、油漆或紡織品色彩比對 | 兩個 sRGB 值的數學比較 | 已校色的分光光度計以及該流程特定的光源、觀察者、設定檔、基底材質與容差 |
| 文字在背景上的可讀性 | 一個由公式定義的知覺差距，但並非可讀性分數 | 對比度工具，例如用於 WCAG AA 或 AAA 的色彩對比度檢查器 |
Limits Worth Knowing Before You Trust the Number
The Color Difference Calculator is a deterministic client-side calculator, not an image picker, a spectrophotometer, an ICC profile converter, an accessibility contrast checker, or a certification service. It measures nothing physical: it only does arithmetic on the sRGB coordinates you hand it. If a translucent foreground matters, composite both colors over a known background first and compare the resulting opaque sRGB values; a translucent overlay is not one standalone opaque sRGB color, and the conversion path does not include a compositing step.
The number is also not a guarantee of perceived equality. Two physically identical patches under one light source and one observer can produce an arbitrary-looking Delta E if the sRGB capture was not color-managed, just as two patches that look indistinguishable to a human can sit on either side of a strict tolerance if the workflow tolerance is tight. For decisions that bind physical production — press approval, brand-color sign-off, paint batch acceptance — pair the calculator with calibrated measurement equipment and the illuminant, observer, profile, substrate, and tolerance conditions required by that process.
For text-on-background readability, this is the wrong tool. The CIEDE2000 number tells you how far apart two colors are in weighted CIELAB space; it does not encode font size, font weight, or the contrast ratio that accessibility guidelines use. Reach for a dedicated contrast-ratio tool instead.
For a deeper walkthrough of the implementation, the role each weighting term plays, or extra examples of common color pairs, the Color Difference Calculator Explained: Delta E 2000 guide continues the same topic from a different angle.
If you're weighing options, Is a Color Difference Calculator Safe to Use Online? covers this in detail.