顏色對比度檢查器
根據WCAG 2.1無障礙標準檢查前景色與背景色的對比度。即時顯示AA/AAA結果。
前景色（文字）
背景色
大文字預覽（18pt粗體）
普通文字預覽 — The quick brown fox jumps over the lazy dog.
14.05:1對比度
AA — 普通文字 (≥ 4.5:1)通過
AA — 大文字 (≥ 3:1)通過
AAA — 普通文字 (≥ 7:1)通過
AAA — 大文字 (≥ 4.5:1)通過
關於本工具
顏色對比度檢查器使用WCAG 2.1相對亮度公式計算前景色（文字）和背景色之間的對比度。
WCAG 2.1定義了兩個合規等級：AA要求普通文字4.5:1，大文字3:1。AAA要求普通文字7:1，大文字4.5:1。
使用方法
- 使用拾色器或輸入十六進位代碼選擇前景色和背景色。
- 預覽顯示文字在普通和大尺寸下的效果。
- 對比度和WCAG通過/未通過結果即時更新。
- 使用範例顏色對探索常見的無障礙模式。
使用情境
UI設計師驗證按鈕標籤和正文文字是否符合WCAG標準。前端開發者在設計系統中檢查文字與背景組合。
常見問題
- 什麼算"大文字"？ — WCAG將大文字定義為至少18pt（24px）常規，或14pt（約18.67px）粗體。
- 支援透明度或rgba嗎？ — 不支援，此工具僅處理純色十六進位。對於Alpha混合顏色，請先與背景合併。
- 應該達到哪個WCAG等級？ — AA是大多數公共網站推薦的最低標準。AAA提供更好的可讀性。
- 4.5:1總是夠用嗎？ — 4.5:1滿足WCAG AA，但視力更差的用戶可能受益於更高的比率。