跳至內容
Monu Tools

顏色對比度檢查器

對照 WCAG AA 和 AAA 無障礙級別檢查兩種顏色之間的對比度。

如何使用 對比度檢查器

  1. 01

    選擇文字顏色和背景顏色。

  2. 02

    查看對比度以及 WCAG 通過或未通過的標記。

  3. 03

    調整顏色,直到達到你需要的級別。

對比度檢查器的作用

這是一個 WCAG 顏色對比度檢查器,可顯示文字顏色和背景顏色之間的確切對比度,以及它是否滿足 AA 和 AAA 可訪問性等級。使用樣本或十六進位代碼選擇顏色並查看即時預覽。

調整兩種顏色,直到徽章達到你需要的級別,結果會立即更新。

為什麼對比很重要

亮度與背景太接近的文字很難或無法閱讀,特別是對於視力低下或色覺缺陷的人,或在明亮陽光下使用手機的人來說。足夠的對比可以讓每個人都清楚地閱讀你的內容。

WCAG AA 和 AAA 閾值

網路內容可訪問性指南 (WCAG) 設定了標準。 AA 是大多數網站所追求的級別,也是許多無障礙法律參考的級別,要求普通文本的比例為 4.5:1,大文本的比例為 3:1。 AAA 較嚴格,為 7:1 和 4.5:1。

大文本的閾值較低,因為較大的字母在較低的對比度下仍清晰可見。它的大小約為 24 像素(18 磅),粗體時為 18.66 像素(14 磅)。

比率是如何計算的

此比率來自使用官方 WCAG 公式的兩種顏色的相對亮度,產生從 1:1(無對比度,相同顏色)到 21:1(黑底白字)的值。

在你的瀏覽器中運行

一切都在你的瀏覽器中計算,因此它是即時且私密的。你選擇的任何內容都不會上傳到任何地方。

常見問題

我需要多大的對比度?

WCAG AA 要求一般文字 4.5:1,大字號文字(18pt 或 14pt 粗體)3:1。AAA 分別要求 7:1 和 4.5:1。

什麼算大字號文字?

至少 24px(18pt)的文字,或粗體時 18.66px(14pt)。大字號文字允許更低的對比度。

對比度如何計算?

根據每種顏色的相對亮度,使用官方 WCAG 公式計算,得出從 1:1(無對比)到 21:1(白底黑字)的值。

來源

報告問題