对比度检查器 使用方法
- 1
输入两种颜色
以 HEX、rgb()、hsl() 或 oklch() 格式输入文字颜色和背景颜色，也可以点开圆形色块来选色。
- 2
查看判定结果
对比度数值和五行“通过”或“未通过”的结果，分别显示正文和大号文字的 AA、AAA 等级，以及图标和边框适用的 3:1 规则。
- 3
应用修复建议
如果某个等级未通过，就选用最接近且能通过的更深或更浅的文字色或背景色，然后复制新的颜色值。
限制与 Pro
免费且不限次数：检查次数不限，每组颜色检查 5 项 WCAG 2.2 标准，每个未通过的等级给出 2 个修复建议，网格最多可放 7 种颜色。
关于 对比度检查器
这个对比度检查器按照 WCAG 2.2 的相对亮度公式，计算两种颜色在亮度上的差距，浏览器的无障碍检测和设计插件用的也是同一种算法。结果是一个介于 1:1（完全相同）和 21:1（白底黑字）之间的比值。成功标准 1.4.3 在 AA 级要求正文达到 4.5:1，大号文字达到 3:1；1.4.6 的 AAA 级则提高到 7:1 和 4.5:1；1.4.11 要求焦点框、输入框轮廓、图表线条等有意义的非文本元素达到 3:1。
实时示例会用你选的颜色显示两种字号的文字、一个描边按钮和一个图标，让你除了数值之外，也能直观判断可读性。比值只保留两位小数并直接截断，不做四舍五入，因为 4.496:1 达不到 4.5:1 的要求。某个等级未通过时，检查器会在保持色相和色度不变的前提下，调整其中一种颜色的 OKLCH 明度，分别为文字色和背景色给出最接近且能通过的值。
检查器只适用于纯色。它无法评估照片或渐变上的文字、透明度、特定屏幕上的字重渲染，也不支持为 WCAG 3 提出的新方法 APCA，所以请把“通过”当作最低要求，并在真实屏幕上再测试一遍。
隐私
两种颜色只保存在当前标签页中：对比度、通过与否的判定和修复建议都由你的浏览器计算，颜色值不会发送到服务器，也不会被保存。