色彩差異計算器是一種瀏覽器型工具,用來比較兩個不透明、六位數的 sRGB HEX 色彩,將兩者轉換為 D50 適配的 CIELAB 座標,並回傳一個稱為 Delta E 2000 的 CIEDE2000 數值差異。免費、無需註冊的版本會在網頁上立即開啟,接受兩個 #RRGGBB 輸入,完整轉換流程在 JavaScript 中於本機執行,並在來源 HEX 值與計算所用的 Lab 數值旁顯示結果。使用時不需要建立帳號、驗證電子郵件或付費步驟,輸入的色彩值會留在瀏覽器分頁中,不會被傳送到遠端伺服器。在預設參數權重 (kL = kC = kH = 1) 下,輸出是一個單一、可重現的數字,用以量化兩個 CIELAB 色彩在 Sharma、Wu 與 Dalal 於 2005 年發表的標準化 CIEDE2000 公式下相距多遠,該公式亦被 W3C CSS Color 4 範例程式碼引用 (https://www.w3.org/TR/css-color-4/#color-conversion-code)。

需要快速數值判定的色彩工作——檢查修訂後的設計權杖是否已偏離原始版本、記錄 QA 備註,或比較從照片中取樣的兩個 HEX 碼——通常不值得為了使用託管服務而承擔註冊的繁瑣流程。無需註冊的工具能繞過這種繁瑣:開啟頁面、貼上兩個值、讀取數字,然後關閉分頁。此工具對輸入格式的嚴格要求,正是為了讓您記錄的結果能被任何人在相同轉換流程下、重新輸入相同的兩個 HEX 值時重現。

color difference calculator free no sign up
色彩差異計算器免費無需註冊:快速入門

免費、無需註冊的色彩差異計算器實際上在做什麼

色彩差異計算器接受恰好兩個不透明、六位數的 sRGB HEX 色彩,格式為 #RRGGBB,將其視為 CSS Color 4 sRGB 管線的輸入,並產生一個 Delta E 2000 值以及計算所用的 D50 適配 CIELAB 座標。每個色彩的轉換依序執行:將八位元通道標準化為 0–1、使用 sRGB 轉換函數將其線性化、相乘得到相對於 D65 光源的 CIE XYZ、從 D65 Bradford 適配至 D50,再將 D50 XYZ 轉換為 CIELAB 亮度、a* 與 b*。CIEDE2000 接著在接近中性的色彩處調整 a* 軸、處理跨越 0°/360° 邊界的色相角、分別為亮度、彩度與色相差異加權,並為藍色區域加入一個旋轉項。此實作使用取自 Sharma、Wu 與 Dalal 參考資料集的常見預設參數權重 (kL = kC = kH = 1) (https://hajim.rochester.edu/ece/sites/gsharma/ciede2000/)。相同的輸入會回傳恰好為零。互換兩個色彩的順序會回傳相同的數字,僅受限於浮點數顯示精度。

該頁面也包含來自 Sharma 補充資料集的八組對符號敏感 (sign-sensitive) 的參考配對,因此色相包覆或加權項目的變更無法僅在簡單的恆等案例上通過。這是一個確定性的用戶端計算器,而不是影像挑選器、分光光度計、ICC 設定檔轉換器、無障礙對比檢查器或認證服務。

三個步驟比較兩個 HEX 色彩

  1. 將第一個六位數 HEX 值(含開頭的 #)貼入第一個輸入框。請使用完整的六位數格式 #RRGGBB;三位數簡寫、八位數含 alpha 的值、CSS 命名色彩以及 display-p3 字串在執行任何轉換之前會被明確拒絕。
  2. 將第二個六位數 HEX 值(含開頭的 #)貼入第二個輸入框,然後選擇「比較色彩」。該頁面會對兩個色彩執行 sRGB 轉線性、D65 XYZ、Bradford D50 以及 CIELAB 轉換,並將未經四捨五入的 Lab 值送入 CIEDE2000。
  3. 記錄兩個原始 HEX 字串以及顯示的 Delta E 2000 數字,並附上觀察或生產的情境——螢幕校準、光源、觀察者、基材與工作流程的容差——以便他人能重現該決策。相同的輸入會回傳 0.0;較大的數字表示公式定義上較大的差異。

為何數學運算在您的瀏覽器中執行,而非在伺服器上

免費、無需註冊的工具會在用戶端 JavaScript 中執行整個計算,這表示兩個色彩值永遠不會離開瀏覽器分頁。不會上傳至託管 API、不會儲存在工作階段記錄中,也不會被送往可能洩漏品牌色彩或取樣照片數值的分析端點。當 HEX 配對代表尚未發布的設計權杖、客戶提供的調色盤,或正在進行中的品牌審閱時,這項隱私優勢最為重要——這些資料不應經過第三方基礎設施。本機運算也意味著頁面一旦載入即可運作,並且沒有排隊、速率限制或隱藏在註冊牆後的免費方案上限。其取捨在於,結果僅反映輸入的 sRGB 座標與已記錄的轉換流程——它無法讀取真實物件、無法取樣印刷色票,也無法擷取外接螢幕的 ICC 設定檔。

嚴格的 #RRGGBB 輸入如何保護結果

此工具的輸入規則刻意狹窄。空值、缺少井字號、三位數簡寫 (#FFF)、八位數含 alpha (#RRGGBBAA)、非十六進位字元以及多餘的位數,都會在任何轉換執行之前引發明確的錯誤。原因在於,靜默地重新解譯這些格式會以使用者未曾同意的方式改變色彩空間或透明度假設。三位數簡寫與其六位數展開碰巧會解析為相同的不透明色彩,但若解析器在展開簡寫時未加以標記,可能會掩蓋不透明與含 alpha 值之間的差異。CSS 命名色彩與 display-p3 字串也是如此,它們帶有嚴格 sRGB 管線無法表示的資訊。若您需要比較半透明前景,請先將其疊加在已知的背景組件上,然後再輸入所得的不透明 sRGB hex。

這種狹窄的接受條件使輸入色彩空間與透明度明確化。接受的輸入恰好是 #RRGGBB 而非其他,因此數學運算是基於使用者透過輸入該值所確認的假設來進行。

在您的工作流程中解讀 Delta E 2000 數字

Delta E 2000 是一個公式導出的距離,而非知覺上的裁決。較大的數字在預設加權下表示較大的計算差異,但此頁面並未將任何固定的截止值標示為通過、不通過、對所有觀察者皆相同,或對每個生產流程皆可接受。原因在於,知覺取決於觀看條件、螢幕校準、環境光、表面質感、周圍色彩以及觀察者的視覺。印刷、油漆、紡織、品牌審閱、攝影與介面設計各自使用不同的儀器與接受限度,因此單一閾值無法同時適用於所有情境。請將此數字視為可重現的比較輔助工具:輸入相同的兩個 HEX 值到相同的計算器,您會看到相同的數字。正是這種可重現性,使其對於設計權杖修訂、取樣影像的 QA 備註以及程式碼審查證據有其用處。如需對公式加權項目的深入說明,請參閱色彩差異計算器解析:Delta E 2000指南。

輸入框旁的兩個色彩色塊提供快速的視覺參考,但螢幕預覽並非色彩測量學的證據。瀏覽器渲染、螢幕色域、色彩設定檔、亮度與校準皆會改變外觀。數值計算僅依據輸入的 sRGB 座標與已記錄的轉換流程;它無法量測真實物件,也無法推論印表機設定檔。

此工具與其他色彩工具的搭配定位

色彩差異計算器回答一個狹窄的問題——這兩個色彩在數學上相距多遠?——而色彩類別中的其他工具則回答相關但不同的問題。下表顯示每項任務適用的工具,讓計算器被用於真正合適之處,而非作為萬用工具。

任務適用工具
量化兩個 HEX 值之間的數學距離色彩差異計算器
依 WCAG AA 或 AAA 測試文字/背景對比色彩對比檢查器
將兩個色彩混合成第三個色彩並讀取結果色彩混合器
將 HEX 值轉換為整數 RGB 通道(或反向)HEX 轉 RGB / RGB 轉 HEX
找出六位數 HEX 色彩的數位 RGB 互補色互補色尋找器
從基礎色彩產生匹配的調色盤調色盤產生器
將未校準的 CMYK 百分比預覽為螢幕 RGBCMYK 轉 RGB
為背景建立無接縫的 SVG 圖樣SVG 圖樣產生器

針對同一工作流程中的無障礙面向,色彩對比檢查器免費、無需註冊指南涵蓋了本計算器刻意不執行的 WCAG 相對亮度路徑。

此計算器不是什麼,以及何時該改用其他工具

此計算器不檢查無障礙對比。對比是一個由 WCAG 相對亮度公式解決的亮度比問題,而 CIEDE2000 並不計算這點。兩個色彩在知覺上可能相距甚遠卻通過 WCAG AA,兩個色彩在知覺上可能接近卻未通過,這取決於文字大小與粗細。針對文字/背景可讀性,請使用專門的對比工具。

此計算器也不是分光光度計、ICC 設定檔轉換器或認證服務。它無法擷取印表機設定檔、無法取樣布料色票,也無法保證兩個實體樣本在店面照明下相符。實體製造決策需要校準過的量測設備,以及該流程所要求的標準、光源、觀察者、設定檔、基材與容差條件。請在以下情境使用本計算器:檢查兩個 CSS 色彩是否在數學上接近、記錄設計權杖修訂、比較取樣影像色彩,或建立可重複的 QA 備註——並記錄兩個原始 HEX 值、回報的 Delta E 2000 數字,以及觀察或生產的情境,以便另一位審閱者能重現該決策。