色彩工具

顏色對比檢查:WCAG AA 與 AAA(免費)

免費、免註冊,在瀏覽器中就能用。 以 WCAG 對比度檢查文字在背景上是否容易閱讀,查看一般文字、大型文字和控制項的 AA 與 AAA 結果,並取得最接近且符合標準的顏色。

大型文字看起來像這樣

一般內文看起來像這樣。敏捷的棕色狐狸跳過了懶狗,而像圖說這樣的小字則放在下方。

小字:14px 圖說。

按鈕
對比度13.08:1
  • 一般文字,AA:通過內文,至少 4.5:1
  • 一般文字,AAA:通過加強級,至少 7:1
  • 大型文字,AA:通過18pt 以上,或 14pt 以上粗體,至少 3:1
  • 大型文字,AAA:通過加強級,至少 4.5:1
  • 圖示和控制項,AA:通過按鈕、邊框、圖表線條:3:1

使用 WCAG 2 對比公式。比值絕不會無條件進位,所以 4.49:1 不算 4.5:1。在您的裝置上檢查。

為什麼要用顏色對比檢查

100% 免費
想用幾次就用幾次。免註冊、無浮水印、不用安裝。
隱私優先設計
您輸入的內容只留在瀏覽器中,絕不會傳送給我們。
任何裝置都能用
可在 Windows、Mac、Linux、Android 和 iPhone 的瀏覽器中執行,不需要安裝 App。

如何使用顏色對比檢查

  1. 輸入或挑選文字顏色和背景顏色。
  2. 查看對比度以及是否通過。
  3. 如果未通過,點選建議的合格顏色。

常見問題

需要多少對比度?
WCAG AA 要求一般文字達 4.5:1,大型文字以及按鈕、圖示等介面元素達 3:1。AAA 則要求 7:1 和 4.5:1。
怎樣算大型文字?
一般字重至少 18 點(24px),或粗體至少 14 點(約 18.7px)。
可以處理半透明的文字顏色嗎?
可以。半透明的文字顏色會先與背景混合,再測量對比度。
為什麼 4.49:1 不合格?
WCAG 規定對比度不得無條件進位,所以低於 4.5:1 的一般文字都不符合 AA。
顏色對比檢查是免費的嗎?
是的。免費使用,免註冊,也不用安裝任何東西。