cv.cm
全部工具

顏色對比度檢查

對比度在目前分頁裡計算。不上傳。

對比度

16px 的一般文字看起來是這樣。

24px 的大字

5.79:1

AA 一般文字(4.5:1)
通過
AA 大字(3:1)
通過
AAA 一般文字(7:1)
不通過
AAA 大字(4.5:1)
通過
介面元件(3:1)
通過

WCAG 2 對比度:AA 一般文字 4.5:1、大字 3:1;AAA 為 7:1 和 4.5:1;非文字 3:1。

使用步驟

依 WCAG 2 AA 和 AAA 檢查一組文字色與背景色。不上傳。

  1. 開啟對比度檢查

    已填好一組粉色配奶油色的範例。右側文字樣本下方是對比度和各項通過/不通過。

  2. 填自己的顏色

    為文字和背景輸入十六進位色碼,或用取色器。「互換」會交換兩者。

  3. 修正沒通過的組合

    一般文字沒過 AA 時,表格下方會給出最接近且能通過的文字色。「複製」會把對比度和結果放到剪貼簿。

常見問題

對比度是什麼意思?

它比較文字色與背景色的相對亮度,範圍從 1:1(同色)到 21:1(白底黑字),依 WCAG 2 的定義計算。

會上傳什麼嗎?

不會。對比度在這個分頁裡計算。

需要多高的對比度?

WCAG AA 要求一般文字 4.5:1、大字 3:1;AAA 要求 7:1 和 4.5:1。圖示、邊框和表單控制項需要 3:1(非文字對比度)。

什麼算大字?

至少 18pt(24px)一般字重,或 14pt(約 18.7px)粗體。

建議色是怎麼來的?

當這組顏色在一般文字上沒過 AA,文字色會一步步往黑或白靠攏(看哪個有用),直到達到 4.5:1。色相盡量保持接近。