使用方式
- 輸入文字（前景）顏色和背景顏色，可使用 HEX、rgb()、hsl() 或其他 CSS 格式，也可以使用選色器。
- 查看對比度，以及各項 WCAG 規範的通過或未通過結果。
- 如果未符合規範，請選擇目標並套用建議顏色；系統會保留色相，只調整亮度。
- 使用「交換」檢查反向搭配，例如深色按鈕上的淺色文字。
運作方式
對比率依照 WCAG 2.2 的定義計算：以 sRGB 色彩通道計算每種顏色的相對亮度，再以（較亮的顏色 + 0.05）÷（較暗的顏色 + 0.05）計算對比率。範圍從 1:1（顏色相同）到 21:1（黑底白字）。
檢查的要求：成功準則 1.4.3（AA）要求一般文字達到 4.5:1、大型文字達到 3:1；1.4.6（AAA）要求分別達到 7:1 和 4.5:1；1.4.11 要求使用者介面元件和有意義的圖形（例如輸入框邊框和圖示）達到 3:1。大型文字是指一般字重至少 24px，或粗體約 18.66px。WCAG 不允許將數值進位，因此即使 4.49:1 已很接近，仍不符合 AA；此處顯示的對比率會截尾，不會四捨五入。
建議值會保留文字顏色在 OKLCH 中的色相和色度，並搜尋能達到目標的最近明度，可能比原色更深或更淺。對比率只是可讀性的一部分；字重、字級和色覺差異也會影響可讀性。WCAG 2.2 是目前的 W3C 建議標準，多數無障礙相關法規都以此為依據。
範例
差一點就達標的灰色文字
白底上的 #777777 文字對比率為 4.48:1。這符合大型文字和 UI 元件的要求，但不符合一般文字的 AA 要求。最接近且符合要求的灰色約為 #767676，對比率可達 4.54:1。
品牌按鈕上的白色文字
#ff8800 上的白色文字對比率約為 2.4:1，連大型文字的 3:1 門檻也未達到。通常可透過加深橘色或改用深色文字來改善；建議值會顯示文字顏色需要加深到什麼程度。
檢查表單欄位邊框
白底上的淺灰色邊框 #cccccc 對比率約為 1.6:1。根據成功準則 1.4.11，用來標示輸入欄位的邊框需要達到 3:1，因此需要使用約 #949494 或更深的顏色。
常見問題
WCAG AA 要求的對比率是多少？
一般內文需要 4.5:1，大型文字（24px，或粗體 18.66px）和 UI 元件及有意義的圖形需要 3:1。AAA 要求文字達到 7:1，大型文字達到 4.5:1。
標誌文字或已停用按鈕的文字也需要符合要求嗎？
不需要。WCAG 豁免標誌和品牌名稱中的文字、純裝飾文字，以及非作用中（已停用）使用者介面元件中的文字。
為什麼我的結果和其他檢查工具略有不同？
有些工具會將對比率四捨五入到小數點後一位，或直接進位。WCAG 比較的是精確數值，因此此工具會將數值截尾至小數點後兩位。輸入含有 alpha 的顏色時，結果也可能有些微差異。
新推出的 APCA 對比方法是什麼？
APCA 是為未來版本 WCAG 提出的另一種方法。它不屬於 WCAG 2.2，而本工具檢測的是 WCAG 2.2，也是現行無障礙規範所參照的版本。
隱私權
顏色會在您的瀏覽器中檢查，不會上傳或儲存任何資料。