色彩對比檢查(WCAG)
計算前景與背景的對比度,依文字大小判定 WCAG AA / AAA 是否通過,並在未達標時建議可用的顏色。
瀏覽器端執行:輸入與輸出不會傳送到伺服器,平台也不會保存你的輸入內容。
輸出
填入左側欄位後按下執行。
使用方法
- 1填入前景與背景色(可用色票或直接貼 #rrggbb)。
- 2設定實際的文字大小與字重——大型文字的門檻比較寬鬆。
- 3未通過時依建議的顏色調整,或改動背景色。
常見問題
AA 和 AAA 差在哪裡?
一般文字 AA 要求 4.5:1、AAA 要求 7:1;大型文字則是 3:1 與 4.5:1。多數專案以 AA 為目標,AAA 通常只用在以閱讀為主的內容。
為什麼文字大小會影響結果?
同樣的顏色,字大就好讀。WCAG 因此把 24px(或 18.66px 粗體)以上視為大型文字,門檻從 4.5:1 降到 3:1。
按鈕邊框、圖示也要達到 4.5:1 嗎?
不用。非文字的介面元件與圖形資訊只需要 3:1(WCAG 2.1 的 1.4.11),工具會一併顯示這條。
通過了就一定好讀嗎?
不一定。WCAG 2 的公式對淺字深底偏寬鬆,也不考慮字體粗細與螢幕。它是最低標準,不是設計驗收的唯一依據。
資料會上傳嗎?
不會。計算完全在瀏覽器執行,不需登入也不消耗任何額度。
