色彩對比度檢查（WCAG）

功能簡介

色彩對比度檢查工具依照網頁內容無障礙指引（WCAG 2.x）判斷文字顏色在背景上是否清晰易讀。文字和背景可以輸入任意 CSS 顏色——十六進位、rgb()、hsl()、顏色名稱或半透明顏色——工具會顯示對比度、每一項 AA 和 AAA 標準是否通過，並即時預覽。若不達標，還會提供色相不變、最接近的達標文字顏色和背景顏色。所有計算都在瀏覽器中完成。

使用方法

1. 輸入或選擇「文字顏色」和「背景顏色」，「交換」可以對調兩者。
2. 查看「對比度」以及一般文字、大型文字和介面元件的通過/不通過清單。
3. 若某個等級不通過，請看「最接近的達標顏色」：每條建議都會顯示新顏色、它的對比度、複製按鈕，按「使用」即可套用。
4. 開啟 APCA 可同時看到 WCAG 3 草案的亮度對比值（Lc）。

半透明顏色會先混合再檢查：文字疊在背景上，背景疊在白色上。

範例

#767676 on #ffffff  →  4.54:1  passes AA normal text
#777777 on #ffffff  →  4.47:1  fails AA normal text, passes AA large text
#000000 on #ffffff  →  21:1    the maximum

對比度如何計算

每個顏色的相對亮度由 sRGB 通道計算（先線性化，再以紅 21%、綠 72%、藍 7% 加權）。對比度等於（較亮者 + 0.05）/（較暗者 + 0.05），範圍從相同顏色的 1:1 到白底黑字的 21:1。只與明暗有關，與色相無關：純紅配純綠看起來很鮮豔，但對比度只有約 1.3:1。

建議顏色只調整顏色的明度（HSL 中的 L），並選擇變化較小的方向（變暗或變亮）。有時任何明暗都達不到要求：中灰色背景上，無論什麼文字顏色都到不了 7:1。