实时计算对比度
输入前景色和背景色后立即得到 WCAG 对比度数值、AA/AAA 等级和正文可用建议。
同页可读性预览
直接用当前颜色组合展示示例文字，方便判断按钮、正文、标签等界面元素是否清晰。
浏览器本地处理
颜色值只在当前浏览器解析和计算，不上传服务器，适合内部设计稿和未发布页面配色复核。
WCAG 对比度 · 浏览器本地计算
检测前景色和背景色可读性
计算颜色对比度、AA/AAA 等级和展示预览。颜色值只在浏览器本地处理，不会上传服务器。
对比度
17.74:1
可读性等级
AAA
建议
正文可用
示例文字 Preview Text
这是前景色和背景色组合后的可读性预览。
工具使用说明
怎么用 无障碍色彩对比度检查器
填入两组颜色
输入 HEX、RGB 或直接粘贴常见颜色值，分别作为文字色和背景色。
查看 WCAG 等级
重点看对比度、AA/AAA 等级，以及页面给出的正文可用建议。
复制检测结果
确认通过后复制检测表格，放进设计走查、无障碍验收或前端 issue 里复核。
功能说明
这个工具解决什么问题
适合设计与前端走查
按钮文字、正文、辅助说明、标签和状态色上线前，都可以先做一轮对比度检查。
结果按 WCAG 常见阈值展示，能快速发现低对比度配色。
本地计算更适合敏感页面
内部后台、未发布活动页和客户项目里的颜色组合不需要提交到服务器。
页面只处理颜色文本，不读取远程页面，也不做第三方接口查询。
常见问题
关于 无障碍色彩对比度检查器，用户常问这些
无障碍色彩对比度检查器会上传颜色值吗？
不会。输入、计算和预览都在浏览器本地完成。
支持哪些颜色格式？
支持常见 HEX、RGB 和简单数字 RGB 输入；无效输入会回退到默认颜色用于预览。
AA 和 AAA 有什么区别？
AAA 要求更高，对比度通常需要达到 7:1；AA 是多数正文可读性检查的常见基础线。
能直接检测网页 URL 吗？
当前不抓取外部网页，只做颜色组合本地计算，避免跨域和第三方页面读取问题。