色彩對比檢查器

所有工具
色彩對比檢查器
檢查文字與背景色之間的 WCAG 對比率——查看一般文字、大型文字和 UI 元件的 AA/AAA 通過／失敗評級，附即時預覽和無障礙色彩建議。
文字顏色
色調
背景顏色
色調
對比率
--:1
一般文字
18px 以下的內文文字（或 14px 以下的粗體文字）
AA AAA
大型文字
18px 以上的一般字型，或 14px 以上的粗體字型
AA AAA
UI 元件
圖示、邊框、表單控制項與圖形
AA AAA
即時預覽

快狐跳過懶犬

對比度充足時，大型文字閱讀起來舒適自如。

這是一段一般內文文字的範例段落。良好的色彩對比讓所有人都能輕鬆閱讀您的內容，包括視力較弱或有色覺障礙的使用者。 範例連結.

小字體和說明文字最難閱讀——需要最高的對比度。
範例按鈕 範例按鈕
建議

所有計算均使用 WCAG 2.x 相對亮度公式即時在您的瀏覽器中完成——無需上傳、無需註冊、完全免費。

分享
相關工具
色盲模擬器

以紅色盲、綠色盲、藍色盲或全色盲患者的視角查看您的圖像或調色板——完全在瀏覽器中執行，不上傳任何內容。
色碼轉換器

在 HEX、RGB、RGBA、HSL、HSLA 和 HSV 之間轉換顏色——選取顏色、調整透明度，並立即複製任何格式。
調色板匯出器

貼上或匯入一組顏色，立即匯出為 CSS 變數、SCSS、Tailwind 設定、JSON 或 SVG 色票——任何調色板的最後一道工序。
熱門搜尋
顏色對比度檢查 wcag 對比度 無障礙對比度檢查 文字對比度檢查 aa aaa 對比度測試 線上檢查顏色對比度

將此免費工具新增到你自己的網站 — 複製並貼上下面的程式碼。