WCAG对比度检查器
网页无障碍已不再是可选项。许多国家明确要求网站符合WCAG颜色对比度标准，忽视这一点可能带来法律风险。这个工具会立刻告诉你颜色组合是否达标，以及与要求差了多少。
选好文字颜色和背景颜色，AA与AAA两个级别的结果秒出。免费使用，不用注册，不用安装任何东西。
对比度比率
21:1
大文本（18pt以上）
正常文本如此显示。敏捷的棕色狐狸跳过懒狗。
WCAG 2.1 合规性
AA - 正常文本
最低需要 4.5:1 比率
AA - 大文本
最低需要 3:1 比率
AAA - 正常文本
最低需要 7:1 比率
AAA - 大文本
最低需要 4.5:1 比率
WCAG对比度标准是什么
网页内容无障碍指南（WCAG）规定了最低对比度要求，目的是让视障人士也能正常阅读文字。这不是走形式——大约每12名男性中有1人、每200名女性中有1人存在某种色觉障碍，此外还有更多人有弱视问题，对他们来说，低对比度的文字根本无法阅读。
对比度比率怎么算
对比度比率反映的是两种颜色亮度的差异。范围从1:1（完全无对比，颜色相同）到21:1（最高对比，纯黑与纯白）。数字越大，文字越好读。
WCAG各级别要求
AA级（通用标准）
大多数网站需要达到的基本级别：
- 普通文本：最低比率 4.5:1
- 大文本（18pt及以上，或粗体14pt及以上）：最低比率 3:1
AAA级（增强标准）
更严格的要求，追求最佳可读性：
- 普通文本：最低比率 7:1
- 大文本：最低比率 4.5:1
常见问题，这个工具帮你揪出来
白底浅灰文字
设计师为了视觉清爽经常用浅灰，但白底上的 #999999 通不过AA。至少要用 #767676 才能达标，正文文字越深越好读。
品牌色用作文字颜色
鲜亮的黄色或嫩绿在logo上很好看，但作为白底文字颜色往往不达标。这是最常见的问题之一，通常要到有人专门指出来才会被发现。
图片上叠加文字
白色文字放在照片上，图片较亮的区域对比度就会不够。用这个工具找到合适的叠层颜色，让文字在整张图上都清晰可读。
表单占位符文字
输入框的占位符通常用很浅的灰色。WCAG是否直接适用于占位符还有争议，但把占位符做得清楚易读，本来就是好的设计习惯。
不达标怎么办
检测结果不合格时，有几个简单的解决方向：
- 加深文字颜色 — 有时调暗几个色阶就够了
- 提亮背景 — 从背景侧入手同样有效
- 加大字号 — 大文本要求较低，有时改字号就解决了
- 加半透明遮罩 — 文字放在图片上时，垫一层半透明底色是最稳妥的办法
法律层面的要求
多个国家和地区有明确规定：
- 美国 — ADA和第508条均引用WCAG标准
- 欧盟 — EN 301 549要求达到WCAG 2.1 AA
- 英国 — 公共部门网站须符合WCAG 2.1 AA
即便没有法律强制要求，符合WCAG也能降低法律风险，让更多人能用你的网站。从各个角度看都值得做。