颜色对比度检查器
根据WCAG 2.1无障碍标准检查前景色与背景色的对比度。即时显示AA/AAA结果。
前景色（文字）
背景色
大文字预览（18pt粗体）
普通文字预览 — The quick brown fox jumps over the lazy dog.
14.05:1对比度
AA — 普通文字 (≥ 4.5:1)通过
AA — 大文字 (≥ 3:1)通过
AAA — 普通文字 (≥ 7:1)通过
AAA — 大文字 (≥ 4.5:1)通过
关于本工具
颜色对比度检查器使用WCAG 2.1相对亮度公式计算前景色（文字）和背景色之间的对比度。
WCAG 2.1定义了两个合规级别：AA要求普通文字4.5:1，大文字3:1。AAA要求普通文字7:1，大文字4.5:1。
使用方法
- 使用拾色器或输入十六进制代码选择前景色和背景色。
- 预览显示文字在普通和大尺寸下的效果。
- 对比度和WCAG通过/不通过结果即时更新。
- 使用示例颜色对探索常见的可访问性模式。
使用场景
UI设计师验证按钮标签和正文文字是否符合WCAG标准。前端开发者在设计系统中检查文字与背景组合。
常见问题
- 什么算"大文字"？ — WCAG将大文字定义为至少18pt（24px）常规，或14pt（约18.67px）粗体。
- 支持透明度或rgba吗？ — 不支持，此工具仅处理纯色十六进制。对于Alpha混合颜色，请先与背景合并。
- 应该达到哪个WCAG级别？ — AA是大多数公共网站推荐的最低标准。AAA提供更好的可读性。
- 4.5:1总是够用吗？ — 4.5:1满足WCAG AA，但视力更差的用户可能受益于更高的比率（7:1或更高）。