顏色對比度檢查器

免費 WCAG 顏色對比度檢查器：在瀏覽器中測試文字與背景色是否符合 AA/AAA 標準。輸入 hex 或 rgb，即時查看對比度比值與通過/未通過。免登錄、不上傳。

這個顏色對比度檢查器測量什麼？

它使用 sRGB 相對亮度，計算前景（文字）色與背景色之間的 WCAG 2.x 對比度比值。您會得到數值（例如 4.52:1），以及普通文字與大號文字在 WCAG AA、AAA 閾值下的通過/未通過結果。這是設計 QA 輔助工具，不能替代整站自動化無障礙審計。

支持哪些顏色格式？

支持十六進制（#RGB、#RRGGBB、#RRGGBBAA）、rgb() 和 rgba()。可粘貼來自 Figma 令牌、CSS 變量或設計文檔的品牌色。#fff 等短 hex 會先展開爲 #ffffff 再計算亮度。

WCAG AA 與 AAA 有何區別？

AA 是常見的法規與產品基線：普通文字 4.5:1，大號文字 3:1。AAA 更嚴格：普通文字 7:1，大號文字 4.5:1。許多站點正文目標 AA，僅對主標題或高風險 UI 追求 AAA。本工具同時展示兩者，便於與設計團隊確定目標。

WCAG 如何定義大號文字？

大號文字指至少 18 磅（24 CSS 像素）常規字重，或至少 14 磅粗體（約 18.66 CSS 像素）。按鈕、說明與腳註常在標題通過 AA 時仍不達標——請檢查實際上線的每種字號，而非僅 H1 色塊。

品牌色會上傳嗎？

不會。解析與亮度計算完全在瀏覽器本地完成。未發佈的調色板與客戶保密色不會離開您的設備。在共用電腦上使用後請清空輸入。

透明度會影響對比度嗎？

rgba 與 #RRGGBBAA 會被解析，但對比度按不透明 sRGB 通道評估——本工具不會對文字與照片背景做 alpha 合成。若文字疊在圖片上，請先取樣有效底色或使用純色遮罩後再檢查。

這個 WCAG 對比度檢查器免費嗎？

是的。核心比值與通過/未通過功能免費，無需登錄。