颜色对比度检查器
对照 WCAG AA 和 AAA 无障碍级别检查两种颜色之间的对比度。
如何使用 对比度检查器
- 01
选择文字颜色和背景颜色。
- 02
查看对比度以及 WCAG 通过或未通过的标记。
- 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(白底黑字)的值。