对比度检查器

&#Contrast Checker

Contrast Checker is available directly in your browser, with no data uploaded.

🎨 常用配色

21.00 : 1
无障碍评级
1:1 3:1 4.5:1 7:1 21:1
AA 正常文字
≥ 4.5 : 1
通过
AA 大文字
≥ 3 : 1
通过
AAA 正常文字
≥ 7 : 1
通过
AAA 大文字
≥ 4.5 : 1
通过
这是一段正常大小的示例文字,用于展示当前前景色在背景色上的可读性效果。The quick brown fox jumps over the lazy dog.
大文字示例 24px Bold
小号辅助文字 12px — 小字在低对比度下更容易难以辨认,需要更高的对比度来保证可读性。
⚖️ 对比度检查器说明

WCAG(Web 内容无障碍指南)对比度检查器,帮助设计师和开发者验证文字颜色与背景颜色之间的对比度是否符合无障碍标准。

📌 WCAG 对比度标准

🎯 使用场景

常见问题

什么算"大文字"?
WCAG 定义大文字为 18pt(24px)或 14pt(18.66px)粗体及以上的文字。大文字因为笔画更粗,在较低对比度下仍可辨识。
对比度是如何计算的?
先将 sRGB 颜色值线性化,然后按公式 L = 0.2126 × R + 0.7152 × G + 0.0722 × B 计算相对亮度。对比度 = (L1 + 0.05) / (L2 + 0.05),其中 L1 为较亮的颜色。

📚 深度解析:对比度检查器

💡 常见使用场景

快速复核「对比度检查器」
先输入一组典型参数跑基准值,再做 ±10%、±20% 调参演算,检查输出是否沿业务常识方向变化。

❓ 常见问题(FAQ)

对比度检查器 结果可直接用于决策吗?
对比度检查器 适合用于预估与复核,正式决策请结合完整数据口径说明(口径定义、时间区间、边界条件)。
结果偏离预期很大怎么办?
先核对输入单位与是否存在“% 与小数”混用,再确认分母与分子定义是否同口径,最后替换一组可复现实例复测。
⚠️ 使用说明与注意事项