开发与数据

颜色对比度检测

计算文字与背景色的对比度,查看 WCAG 常规文字与大字参考阈值。

◈ 本地处理 · 输入不上传

输入与设置

此工作区在当前浏览器内处理;刷新后不保留输入。

结果工作台

填写内容后,点击生成结果。

↗

结果会显示在这里

查看明细、复制或下载,再继续你的工作。

如何使用颜色对比度检测

  1. 在工作区填写文字颜色(HEX),按需要调整选项。
  2. 点击生成结果,查看结果和错误提示。
  3. 核对结果后复制或下载;涉及上线、采购或发布时,再做实际验证。

试一个具体例子

深色文字 #1e293b 放在白色背景上,查看对比度和 AA/AAA 结果。

结果怎样理解

使用 WCAG 相对亮度计算,两色不支持透明叠加。常规文字 AA 为 4.5:1,大字 AA 为 3:1;字号、粗细和交互组件仍需单独评估。

常见问题

对比度通过就满足全部无障碍要求吗?

不满足,还需键盘操作、语义标签、焦点和替代文字等。

大字指什么?

WCAG 大字通常指约 18pt 或 14pt 粗体及以上,需结合字体呈现。

支持透明色吗?

当前接受不透明 HEX,请先计算实际合成颜色。