一個以 CIEDE2000 公式為核心打造的色差計算器替代方案,讓你無需安裝軟體、註冊帳號或將色彩值上傳到伺服器,就能為任意一對不透明的六位數 sRGB HEX 色彩取得符合標準的 Delta E 2000 數值。Color Difference Calculator 完全在你的瀏覽器中執行,解析兩個 #RRGGBB 輸入值,正規化每個 sRGB 通道,透過 sRGB 轉換函數將數值線性化,乘入相對於 D65 的 CIE XYZ,再以 Bradford 矩陣調適到 D50,接著轉換為 CIELAB,最後才以輕度、色度與色相預設權重皆為 1 的設定計算 CIEDE2000。這條完整的管線——包含處理藍色區域的旋轉項,以及跨越零度的色相循環——正是真正的色差計算器有別於快速歐氏距離檢查的原因。由於轉換流程遵循 W3C CSS Color 4 範例路徑,且實作已與 Sharma、Wu 與 Dalal 的補充 Lab 色對 進行驗證,因此你得到的是一個綁定在有文件記載的數學之上的可重現數值,而非某家廠商的私有公式。
為何基於瀏覽器的替代方案適用於 HEX 比較
多數人會想到的色差計算器大致分成三類:搭售分光光度計的商業桌面套件、從學術論文複製而來的試算表巨集,以及悄悄放寬輸入規則的網頁工具。Color Difference Calculator 在這個問題空間中刻意走一條狹窄的路徑。它每個色彩只接受一個不透明的六位數 HEX 值,在第一時間就拒絕簡寫、帶 alpha 通道的 HEX、具名色彩以及 display-p3 數值,並回傳單一的 Delta E 2000 數值,連同用於計算的 D50 調適 CIELAB 座標。這份嚴謹的合約消除了其他工具在解析或合成時所憑藉的隱含假設。
純瀏覽器處理的重要性不亞於輸入紀律。由於資料完全不會離開你的裝置,你可以在受限的工作站上將設計權杖、取樣色票或品管色對貼進計算器,而不會觸發資料處理審查流程。你也能省去安裝步驟——這正是多數獨立色彩科學工具在鎖定的企業機器上會遇到的障礙——同時跳過授權費用算計,讓分光光度計軟體套件不再對小型工作室或自由接案團隊遙不可及。這種結合標準化數學、嚴格輸入與本機處理的方式,讓這個工具有資格成為真正的替代方案,而非桌面軟體的精簡版複製品。
CIEDE2000 實際測量的是什麼
CIEDE2000 是 CIE 於 2001 年發布的感知色差公式。不同於在 RGB 或甚至 CIELAB 中的純歐氏距離,它會在接近中性色時調整 a* 軸、處理跨越零度邊界的色相角,並對明度、色度與色差分別套用不同的權重。一項旋轉項也對藍色區域有所幫助,因為人眼在該區域對細微色相偏移最為敏感。
預設的參數權重 kL、kC 與 kH 皆等於 1。這使得公式在相同預設條件下具有對稱性:以色彩 A 對色彩 B 進行比較,與以色彩 B 對色彩 A 進行比較會得到相同結果,差異僅來自浮點數的顯示精度。相同的輸入會回傳零,較大的數值則代表由公式定義的差異更大。
但這個數字並不會替生產流程決定通過或不通過。印刷、油漆、紡織、品牌審查、攝影以及介面設計各自仰賴不同的儀器與驗收標準,而用來驗證實作的 Sharma 參考色對,其設計目的是在困難色對上對公式施加壓力,而非認證公差。請將結果視為可重現的比較輔助工具,而非保證兩個實體樣本在每位觀察者與各種觀察條件下都會吻合。
如何逐步比較兩個 HEX 色彩
請依下列三個步驟執行符合標準的比較:
- 在瀏覽器中開啟 Color Difference Calculator。
- 將第一個色彩輸入為帶有前置井字號的不透明六位數 sRGB HEX 值,例如 #1F6FEB。
- 以相同格式輸入第二個色彩,例如 #2563EB。
- 選擇 Compare colors,依序執行 sRGB 轉線性、D65 XYZ、Bradford D50 調適、CIELAB 轉換,以及 CIEDE2000 計算。
- 將 Delta E 2000 結果與計算時使用的 D50 調適 CIELAB 座標一併讀取。
- 記錄兩個原始 HEX 值、回報的 Delta E 2000 數字、觀察或生產情境,以及適用於你工作流程的公差,讓其他人能夠重現這個決策。
若任一輸入被拒絕,工具會在任何轉換執行之前明確報錯。請修正格式後再試一次。
輸入規則與工具拒絕其他格式的原因
驗證會在任何計算之前執行。空值、缺少井字號、三位數簡寫、帶 alpha 通道的 HEX、非十六進位字元,以及額外的位數,都會產生明確的錯誤,而不是靜默地重新解讀。
| 接受 | 拒絕 |
|---|---|
| 帶前置井字號的 #RRGGBB | #RGB 簡寫展開 |
| 六個十六進位數字,大小寫皆可 | 八位數含 alpha 通道的 HEX |
| CSS 具名色彩及其變體 | |
| 僅限不透明 sRGB | display-p3、HSL、CMYK 或其他色彩空間字串 |
| 每個欄位一個值 | 空欄位、缺少井字號或非十六進位字元 |
這套嚴格的規則保護了結果的正確性。簡寫展開假設了一套三位數色彩間並不一致的雙倍規則,alpha 會引入一個依賴於計算器未知的背景色的合成步驟,而具名色彩在不同 CSS 版本之間存在細微差異。拒絕這些輸入讓輸入的色彩空間與不透明度變得明確,使 CIEDE2000 數字的意義能與其表面顯示一致。
若透明度對比較很重要,請先將兩個色彩以同一已知背景進行合成,再把得到的不透明 sRGB 值送入計算器,因為半透明前景本身並不是單一的獨立色彩。
解讀 D50 CIELAB 座標
除了 Delta E 2000 數字之外,計算器也會顯示每個色彩的 D50 調適 CIELAB 值:L* 代表感知明度、a* 代表紅綠軸、b* 代表藍黃軸。顯示時會套用四捨五入以維持可讀性,但未四捨五入的值仍會繼續用於色差公式。選擇 D50 白點是刻意的:多數現代印刷規格與色彩管理工作流程皆使用 D50,因此將 sRGB 輸入調適到 D50,能讓比較對齊到你實際觀看打樣或印刷樣本的環境。
對於已經習慣以 RGB 或 HEX 思考的審查者而言,Lab 檢視是理解「為何 Delta E 相同卻在螢幕上看起來不同」的最直覺方式。L* 產生小幅位移而 a*、b* 變化不大時,看起來像亮度變化;而在藍色區域附近,b* 的小幅位移則可能讓色相變化感覺比 Delta E 所顯示的更明顯,這正是 CIEDE2000 內建旋轉項所致。
沒有通用閾值時的公差區間
在比較之後,常見的後續問題是:「這個 Delta E 可以接受嗎?」任何 CIEDE2000 參考資料誠實的回答都是:並無單一通用的閾值適用。公差取決於表面、觀察者、光源、儀器以及生產流程。在這個前提下,色彩科學討論常會引用與觀察者感知相關的粗略質性區間,對尺度有概念有助於解讀計算器的輸出。
| 質性區間 | 觀察者通常回報的內容 |
|---|---|
| 極小 | 在一般觀察條件下,大多數觀看者無法察覺差異 |
| 小 | 僅在近距離檢視或對比中性邊界時才能察覺差異 |
| 中等 | 差異清楚可察覺,但色彩仍感覺相關 |
| 大 | 一眼即可看出差異,且色彩讀起來截然不同 |
使用計算器時,請同時記錄兩個 HEX 值與回報的 Delta E,並附上產生該決策的觀察或生產情境。品牌審查方面,請將該數字與印刷供應商提供的規格表搭配使用。介面設計方面,若色彩曾作為文字與背景出現,請搭配 Color Contrast Checker 所給出的對比值一併使用。
螢幕計算無法取代實體測量的情境
Delta E 數字純粹是數學的產物。它僅由輸入的 sRGB 座標與前述轉換路徑計算而得,無法測量實體物件、讀取印表機設定檔,也無法補償螢幕色域、亮度或校準。頁面上的兩個色塊提供快速的視覺參考,但螢幕預覽並非色彩測量學的證據。
若決策涉及實體製造,請使用具備該流程所需光源、觀察者、設定檔、基材與公差條件的校準量測設備。計算器是針對 HEX 數學、設計權杖修訂、取樣影像色彩以及可重複品管註記的比較輔助工具。它並非認證服務、ICC 設定檔轉換器、無障礙對比檢查器,也並非分光光度計。針對文字可讀性,請使用對比值工具;針對實體配色,請使用儀器。
與無障礙對比檢查器的區別
CIEDE2000 數值與 WCAG 對比值回答的是不同的問題。CIEDE2000 估計的是兩個色彩在整個色彩空間中的感知差異;WCAG 比例估計的則是一種色彩的文字在另一種色彩背景上的易讀程度。兩者可能走向相反方向,特別是在接近中性的區域——CIEDE2000 中的旋轉項會壓縮感知距離,但低對比值仍然會在可讀性檢查中失敗。
Color Difference Calculator vs Accessibility Contrast 指南 詳細說明了這項區別。請使用計算器來記錄兩個設計權杖是否在感知上產生漂移,並使用對比檢查器來判斷文字色彩在其背景上是否可讀。兩個工具互補而非重疊,各司其職才能讓品管文件保持一致。
若想深入了解,請參閱 Color Palette Generator Alternative: A Local Browser Tool。