對比度檢查
檢查文字與背景顏色的 WCAG 對比度是否達到 AA／AAA，支援透明度，並建議最接近的合格顏色。
支援 HEX、rgb()、hsl()、hwb()、oklch()、oklab() 與 CSS 顏色名稱，可含透明度。
支援 HEX、rgb()、hsl()、hwb()、oklch()、oklab() 與 CSS 顏色名稱，可含透明度。
對比度
5.36:1
APCA 參考值：Lc 76.3
WCAG 2 檢查結果
- 一般文字 AA需要 4.5:1✓ 通過
- 一般文字 AAA需要 7:1✗ 未通過
- 大字 AA需要 3:1✓ 通過
- 大字 AAA需要 4.5:1✓ 通過
- 介面元件與圖形需要 3:1✓ 通過
APCA 是 WCAG 3 草案中的對比演算法，數值僅供參考，不代表符合現行規範。
預覽
一般文字：敏捷的狐狸跳過懶狗。The quick brown fox jumps over the lazy dog.
大字標題 Large text
建議顏色
保持色相與彩度，只調整 OKLCH 亮度，找出最接近且能通過的顏色。
調整文字顏色
- 一般文字 AAA#2253b8 (7:1)
調整背景顏色
- 一般文字 AAA這個色相調整亮度也無法達到。
使用說明
- 在「文字顏色」與「背景顏色」輸入任何 CSS 顏色，例如 #3366cc、rgb(51 102 204 / 80%) 或 oklch(52% 0.16 262)，也可以用取色器挑選；按「對調顏色」可以交換兩者。
- 「對比度」會即時顯示 WCAG 2 對比值，並列出一般文字、大字與介面元件是否達到 AA／AAA 標準。
- 「預覽」用你的顏色示範一般文字、大字、按鈕與圖示的實際樣子。
- 未通過時，「建議顏色」會列出保持色相、只調整亮度後最接近的合格顏色，按「套用」即可替換，或按「複製」取得色碼。
常見問題
AA 與 AAA 的標準是多少？
WCAG 2 規定一般文字與背景的對比至少 4.5:1 才達 AA，7:1 達 AAA；大字（18 pt／24 px 以上，或 14 pt／約 18.66 px 以上的粗體）AA 只需 3:1、AAA 需 4.5:1。按鈕邊框、表單欄位、圖示等介面元件與圖形，依 1.4.11 至少要 3:1。
對比值為什麼是無條件捨去？
WCAG 不允許把結果四捨五入進位，例如 4.499:1 不算達到 4.5:1。本工具以未經捨入的數值判斷是否通過，顯示時則無條件捨去到小數點後兩位。
有透明度的顏色怎麼計算？
先把背景疊在白色頁面上，再把文字疊在得到的背景上，以實際看到的不透明顏色計算對比。如果你的頁面底色不是白色，請直接輸入合成後的背景顏色。
建議顏色是怎麼找的？
在 OKLCH 色彩空間保持色相與彩度，只往較暗與較亮兩個方向調整亮度，找出最接近原色、而且四捨五入成 HEX 之後仍然通過的顏色。顏色太接近中間灰時，有時往任何方向都無法達到 AAA，這時會顯示無法達到。
APCA 是什麼？
APCA（Accessible Perceptual Contrast Algorithm）是 WCAG 3 草案提出的新對比演算法，會區分深色字淺色底與淺色字深色底，以 Lc 值表示。目前仍是草案，本工具依 APCA-W3 0.0.98G-4g 計算，僅供參考，法規與驗收仍以 WCAG 2 為準。
我的資料會被上傳嗎？
不會。所有計算都在你的瀏覽器中完成，不需要連網。