颜色对比度检测
检测 WCAG 对比度等级
颜色与设计
🔒 100% 本地运行 — 你的数据不会离开当前页面由 Evan 维护•最近更新：2026年9月29日
选项模式
Colors
先填前景色和背景色，直接看对比度和 WCAG 等级；配色示例可在高级模式查看。
Aa
Contrast Result
Contrast
17.40:1WCAG AA (normal)PASS
WCAG AA (large)PASS
WCAG AAA (normal)PASS
🔒 浏览器内本地处理
页面阅读模式
完整说明还包括常见问题处理、操作示例、代码片段、FAQ 和相关工具，便于核对结果或排查问题。
工具说明
计算两个不透明的 3 位或 6 位 sRGB 十六进制颜色之间的 WCAG 2 对比度。页面使用未取整的比例判断 AA 普通文本、AA 大文本及 AAA 普通文本。它只检测一组颜色，不代表整页无障碍合规。
生产可用片段
极端情况下的参考比例
text
#000000 on #ffffff: 21.00:1
#ffffff on #ffffff: 1.00:1
#777777 on #ffffff: 4.48:1 (fails AA normal text)常见问题
AA 和 AAA 的阈值是多少？
AA 普通文本要求 4.5:1，大文本要求 3:1；AAA 普通文本要求 7:1，大文本要求 4.5:1。页面显示三个检查项，没有单独的 AAA 大文本结果行。
什么算大文本？
WCAG 以至少 18 pt 常规字重或 14 pt 粗体为大文本，分别约为 24 CSS px、18.67 CSS px。本工具不会检查实际字体字重或渲染页面，需要自行选择适用阈值。
为什么显示 4.50:1 仍可能不通过 AA？
显示保留两位小数，判断使用未取整值。略低于 4.5 的比例可能显示成 4.50，但仍不达标；不能通过四舍五入把结果抬到阈值。
能检测透明色、图片或渐变吗？
仅接受不透明的 3 位或 6 位十六进制颜色。透明图层需先与真实背景合成，图片和渐变需检查相关位置；一组颜色不会自动覆盖这些情况。
继续浏览