色彩對比檢查(WCAG)

計算前景與背景的對比度,依文字大小判定 WCAG AA / AAA 是否通過,並在未達標時建議可用的顏色。

瀏覽器端執行:輸入與輸出不會傳送到伺服器,平台也不會保存你的輸入內容。

輸入

內容不會被保存

WCAG 的「大型文字」是 24px,或 18.66px 以上的粗體。

輸出

填入左側欄位後按下執行。

使用方法

  1. 1填入前景與背景色(可用色票或直接貼 #rrggbb)。
  2. 2設定實際的文字大小與字重——大型文字的門檻比較寬鬆。
  3. 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 的公式對淺字深底偏寬鬆,也不考慮字體粗細與螢幕。它是最低標準,不是設計驗收的唯一依據。

資料會上傳嗎?

不會。計算完全在瀏覽器執行,不需登入也不消耗任何額度。