Search for a command to run...
计算任意两种颜色的 WCAG 2.1 对比度，并即时给出 AA 与 AAA 判定结果。
支持 #RGB、#RRGGBB、#RRGGBBAA、rgb()/rgba() 与 hsl()/hsla()，不支持 CSS 颜色名称。
Alpha 会先合成到背景上再测量，半透明背景则合成到白色之上。
建议的达标颜色
将前景色明度分别向黑色和白色调整，直到满足 AA 4.5:1，并给出最接近的颜色。
对比度
3.66:1
#7B8794 / #FFFFFF
AA 正文文本
最低 4.5:1
AA 大号文本
最低 3.0:1
AAA 正文文本
最低 7.0:1
AAA 大号文本
最低 4.5:1
非文本与 UI 组件
最低 3.0:1
预览
正文最常用的 16px 常规文本。
大号文本 24px 加粗
What
颜色对比度检查器用于计算前景色与背景色的相对亮度之比，WCAG 2.1 正是用这个值判断文本是否易读。工具会解析 hex、rgb() 与 hsl() 值，先把 Alpha 合成到背景上，再逐项给出 AA 与 AAA 判定。
Cases
发布设计系统色板前校验正文对比度
确认浅灰色占位文字是否达到 AA
按非文本 3:1 标准检查按钮与图标颜色
同时审查深色模式与浅色模式配色
品牌色不达标时寻找最接近的替代色
在无障碍评审记录中留下判定结果
How To
输入前景色与背景色，即可看到 WCAG 判定。
使用取色器，或直接输入 hex、rgb()、hsl() 值。
以同样方式设置背景色，需要时用交换按钮互换两色。
查看对比度以及 AA、AAA 与非文本项的通过或不通过标记。
不达标时应用建议色，然后复制结果报告。
Knowledge
FAQ