开发者🔒 在浏览器中运行

颜色对比度检查器

检查WCAG AA/AAA颜色对比度合规性

文字颜色

背景颜色

预览标题文字

这是使用这些颜色的正文文字效果。

这是供参考的小文字。

对比度

21.00:1

WCAG AA

普通文字✓ 通过

大文字（18px+）✓ 通过

UI组件✓ 通过

WCAG AAA

普通文字✓ 通过

大文字（18px+）✓ 通过

关于颜色对比度检查器

颜色对比度检查器根据WCAG 2.1指南评估两种颜色之间的对比度。它会告诉你颜色组合是否符合普通文字、大文字和UI组件的AA或AAA无障碍标准。所有操作在浏览器中运行。

什么是好的对比度？

WCAG AA要求普通文字的最低对比度为4.5:1，大文字（18px+或14px+粗体）为3:1。WCAG AAA要求普通文字7:1，大文字4.5:1。对比度越高，可读性越好。

AA和AAA有什么区别？

AA是大多数Web内容推荐的最低标准。AAA是更严格的标准，为视力障碍用户提供更好的可读性。满足AAA是理想的，但并非总是必须的。

对比度是如何计算的？

对比度使用WCAG 2.1定义的每种颜色的相对亮度进行计算。该公式在1:1（无对比度）到21:1（黑白最大对比度）的范围内比较较亮和较暗的颜色。