CIEDE2000 色差計算器會在兩個不透明 sRGB 色彩之間回傳一個 Delta E 2000 數值，而無障礙對比工具則會回傳前景與背景之間的 WCAG 相對亮度比率；這兩種輸出在設計審查或無障礙稽核中無法互相替代。相同的搜尋詞涵蓋了這兩個概念，這就是為什麼人們在不確定自己需要哪個工具時，會輸入「color difference calculator accessibility contrast」。CIEDE2000 是一種基於公式的感知距離，會在將每個輸入轉換為 D50 適應的 CIELAB 之後，分別對明度、彩度與色相加權；WCAG 相對亮度公式則在一對色彩中，以較亮與較暗的色彩計算 (L1 + 0.05) / (L2 + 0.05)。CIEDE2000 產生的數值中，相同的色彩回傳零，數值越大代表由公式定義的差異越大；WCAG 比率則從 1:1 到 21:1，並對應 AA 與 AAA 的通過門檻。了解你的工作流程實際上需要哪一種測量，以及哪個工具會產生該測量結果，能避免浪費修改輪次，並產生審查者可以重現的文件。
色差計算器實際上測量的是什麼
嚴格意義上，這裡所說的色差計算器是 CIEDE2000 的實作。Color Difference Calculator 接受兩個不透明、含井號前置的六位數 sRGB HEX 值，並回傳一個 Delta E 2000 數值，總結兩者之間基於公式的距離。轉換流程遵循 W3C CSS Color 4 範例程式碼 (W3C CSS Color 4 轉換範例)：每個 sRGB 通道先正規化至 0 到 1 的範圍，再以 sRGB 轉換函數進行線性化，接著依 D65 光源乘入 CIE XYZ，然後透過 Bradford 矩陣從 D65 適應到 D50，最後轉換為 CIELAB。顯示的 Lab 數值會為了可讀性而四捨五入，但未四捨五入的座標會繼續進入差異公式運算。
CIEDE2000 比 CIELAB 中的純歐氏距離更為複雜。它會在中性色附近調整 a 軸、跨越零度邊界處理色相角的循環、分別對明度、彩度與色相差異套用不同權重，並加入一個旋轉項以補償在藍色區域中已知的誤差。Sharma、Wu 與 Dalal 的論文 (Sharma CIEDE2000 實作參考) 是權威性的實作來源，而計算器的八組對正負號敏感之參考配對即取自該資料集，以確保公式在簡單的相同色案例上不會悄悄退化。在預設的參數權重 kL、kC、kH 皆設為 1 的情況下，結果具有對稱性：比較色彩 A 與色彩 B 所產生的數值，與比較 B 與 A 相同，唯受限於浮點數顯示精度。
WCAG 對無障礙對比的定義
無障礙對比是一項獨立的測量，由 W3C 網頁內容無障礙指引所規範。WCAG 2.x 為 sRGB 定義相對亮度，並將對比比率計算為 (L1 + 0.05) / (L2 + 0.05)，其中 L1 為兩者相對亮度中較亮者，L2 為較暗者。該比率以 1:1 至 21:1 的範圍表示。AA 級要求一般內文達 4.5:1，大型文字達 3:1；AAA 級則分別提升至 7:1 與 4.5:1。非文字 UI 元件相對於相鄰色彩至少需達 3:1。
之所以有這項測量，是因為低視力讀者以及在不良光線下觀看螢幕者的可讀性，取決於前景與背景之間的亮度分離，而非色相或彩度。兩個 CIEDE2000 Delta E 偏低的色彩，若亮度相近，仍可能不符合 WCAG；而兩個 Delta E 偏高的色彩，若一個偏亮、一個偏暗，則可能通過。專門的 WCAG contrast checker 會套用相對亮度公式，並依相關的 AA 或 AAA 門檻回報比率。
為何這兩個概念容易被混淆
兩個詞組都包含「color」一詞，都會產生單一數值，且都在設計審查中具有重要性——這樣的重疊已足以造成混淆。搜尋引擎更強化了這個現象，因為設計師在不確定需要哪個工具時，常常會輸入「color difference calculator accessibility contrast」。這種重疊多半是表面的。CIEDE2000 是一種同時考量色相、彩度與明度的距離指標；WCAG 對比則是忽略色相與彩度、僅考量亮度的比率。兩者的輸入也不同：本工具中的 CIEDE2000 需要兩個不透明的 HEX 色彩；WCAG 對比則預設一組文字色與背景色，兩者皆不透明，並將前景與背景角色視為相異。
也存在一些實際情境，CIEDE2000 數值對無障礙相關工作確實有用。稽核品牌權杖、審視調色盤擴展、驗證影像色彩萃取，或記錄設計權杖修訂的設計師，能從一個不依賴螢幕校色的可重現距離數值中受益。相對地，WCAG 對比數值回答的是不同的問題。在簽核階段混淆兩者，會產生看似量化但實際上針對錯誤合規要求的文件。
如何執行色差計算
該計算器完全在你的瀏覽器中執行，三個步驟即可涵蓋典型工作流程。
- 輸入兩個不透明、含井號前置的六位數 sRGB HEX 色彩。計算器刻意拒絕三位數簡寫、含 alpha 通道的 HEX、具名色彩、display-p3 值以及格式錯誤的字串，以維持輸入色彩空間與不透明度的明確性。
- 選擇 Compare colors。瀏覽器會將兩個 HEX 值轉換為 D50 CIELAB，並以 kL = kC = kH = 1 計算 CIEDE2000。運算在本地進行，不會有任何色彩值離開裝置。
- 記錄原始 HEX 值、顯示的 Delta E 2000 數值，以及適用於你工作流程的容差與觀察情境。若缺少情境，相同的 Delta E 在油漆品管與介面設計中可能代表不同意義。
CIEDE2000 何時有助於無障礙相關工作
當你需要兩個不透明 CSS 色彩之間可重現的距離、文件化的設計權杖修訂、取樣影像色彩的比較，或其他審查者可以重複執行的品管註記時，請使用色差計算器。Delta E 2000 數值具有對稱性、決定性，並與一份公開公式綁定，因此適合用於變更日誌、回歸測試與設計權杖稽核軌跡。它也有助於從影像中取色：取樣 HEX 與目標品牌 HEX 之間的低 Delta E，提供了接受或拒絕該取樣的數值依據。
針對持續進行的無障礙審查，請將該計算器與真正的對比工具搭配使用。兩者涵蓋不同的範疇並產生不同的數值，任何混用兩者的稽核都會招致審查者的質疑。一個有用的模式是：將品牌權杖配對送入 Color Difference Calculator 進行漂移監控，再將同一組權杖送入 WCAG 檢查器進行合規審查，然後將兩個數值連同理由與觀察情境一併存檔，使稽核軌跡同時涵蓋兩類決策。
何時應改用真正的對比檢查器
凡是涉及文字在背景上是否仍清晰可讀的決策，請使用專門的 WCAG 對比檢查器。相對亮度公式與 AA / AAA 門檻是該問題在法律與設計系統上的參考依據，只有實作了 WCAG 亮度計算的工具，才能產生你在無障礙稽核中可引用的比率。CIEDE2000 無法回答此問題，因為該公式的加權方式與人類閱讀任務不同，且公開的 Delta E 結果本身並不帶有通過或失敗的門檻。
非文字 UI 元件亦同。圖示、表單欄位邊框、聚焦環與圖表線條需要的是相對於相鄰色彩的亮度比率，而非 Delta E。實作了 WCAG 亮度比率並回報圖形元件最低 3:1 的對比工具，才能給出正確答案；Delta E 2000 數值則無法。以這些用語記錄決策，稽核軌跡才能符合審查者將檢視的內容。關於實務工作流程，請參閱 Check Color Contrast for Accessibility in Real Time 中的逐步說明。
CIEDE2000 與 WCAG 對比：快速比較
| Attribute | CIEDE2000 (Color Difference Calculator) | WCAG contrast ratio (dedicated checker) |
|---|---|---|
| Output | Single Delta E 2000 number | Luminance ratio on a 1:1 to 21:1 scale |
| What it measures | Formula-based perceptual distance in D50 CIELAB | Luminance separation for readable text and non-text UI |
| Inputs | Two opaque six-digit #RRGGBB sRGB HEX values | Foreground (text) and background sRGB colors, both opaque |
| Pass or fail threshold | No universal threshold; depends on workflow tolerance | AA: 4.5:1 normal text, 3:1 large text; AAA: 7:1 and 4.5:1; 3:1 for non-text UI |
| Symmetry | Yes (kL = kC = kH = 1) | No: brighter and darker roles are fixed by the formula |
| Considers hue and chroma | Yes, with hue wrapping and a blue-region rotation term | No |
| Best suited for | Brand tokens, palette drift, image sampling, design-token audits | Text legibility, WCAG audits, non-text UI components |
記錄結果以便他人重現
無論計算器回報什麼，請寫下兩個原始 HEX 值、Delta E 2000 數值，以及適用於該決策的觀察或生產情境。若缺少情境，相同的數值在一個工作流程中可能代表通過，在另一個中卻代表不通過。針對實體生產（含印刷、油漆與紡織），請將計算器結果與該流程所要求的相關標準、光源、觀察者與容差一併記錄，並將 Delta E 視為輔助比較的工具，而非實體匹配的保證。針對數位工作，請記錄審查期間使用的顯示器或模擬器，因為螢幕外觀會隨校色、環境光與周圍色彩而改變，即使公式結果並未改變。計算器頁面上的可見色塊僅作為快速視覺參考，而非色彩量測證據，因此請將 HEX 值與 Delta E 數值連同任何描述結果的註記一併擷取。