WCAG对比度检查器 — 在线检测颜色无障碍
在线检查颜色对比度是否符合WCAG 2.1无障碍标准。测试前景色和背景色，获取AA/AAA等级判定，预览文本可读性。浏览器本地运行，无需上传。
功能特性
- ✓实时对比度计算，使用WCAG 2.1 sRGB亮度公式
- ✓WCAG AA和AAA合规性检查，支持普通文本、大文本和UI组件
- ✓支持十六进制、RGB和HSL颜色格式输入，含可视化颜色选择器
- ✓即时通过/失败指示器，清晰显示每个WCAG等级的合规状态
- ✓实时文本预览，查看颜色组合的实际显示效果
- ✓可调预设文本大小，分别测试普通文本和大文本场景
- ✓颜色交换按钮，快速测试前景色和背景色互换后的效果
- ✓智能颜色建议，当组合不合规时推荐满足WCAG标准的颜色
- ✓支持Alpha透明度，测试覆盖层和半透明颜色组合
- ✓所有计算在浏览器本地完成，数据不离开您的设备
使用方法
- 1使用颜色选择器或十六进制输入框设置前景色（文字颜色）
- 2使用颜色选择器或十六进制输入框设置背景色
- 3查看中间显示的实时对比度比例
- 4检查WCAG合规性面板，查看普通文本、大文本和UI组件的AA/AAA通过/失败状态
- 5在预览区域查看实际文本效果，确认颜色组合的可读性
- 6如果组合不合规，点击推荐颜色查找无障碍替代方案
- 7使用交换按钮快速反转前景色和背景色，测试反向组合
- 8调整预设文本大小滑块，分别测试普通文本（小于18pt）和大文本（18pt及以上）场景
- 9复制对比度比例值，用于文档或无障碍报告
- 10测试网站、应用、演示文稿和印刷材料的颜色组合，确保无障碍合规
常见问题
什么是WCAG对比度比例？
∨
WCAG对比度比例是衡量两种颜色之间亮度差异的数学计算。范围从1:1（无对比度，相同颜色）到21:1（最大对比度，黑白配色）。公式基于sRGB色彩空间的相对亮度。比例越高，视觉障碍用户的可读性越好。
WCAG AA和AAA标准是什么？
∨
WCAG（Web内容无障碍指南）定义了两个合规级别：AA是大多数无障碍法律要求的最低标准，AAA是增强标准。普通文本AA要求4.5:1对比度，AAA要求7:1。大文本（18pt+或14pt+加粗）AA要求3:1，AAA要求4.5:1。UI组件和图形对象要求3:1的AA标准。
什么算大文本？
∨
WCAG将大文本定义为：1）18pt（约24px）或更大，或2）14pt（约18.66px）或更大的加粗文本。大文本的对比度要求较低，因为较大的字符即使对比度较低也更容易阅读。本工具允许您分别测试这两种场景。
对比度比例是如何计算的？
∨
公式为：(L1 + 0.05) / (L2 + 0.05)，其中L1是较亮颜色的相对亮度，L2是较暗颜色的相对亮度。相对亮度通过将sRGB值转换为线性光值（使用伽马校正），然后应用加权系数（R: 0.2126, G: 0.7152, B: 0.0722）计算得出。
为什么颜色对比度对无障碍很重要？
∨
全球约有3亿人患有色觉缺陷，超过20亿人有某种形式的视力障碍。适当的对比度确保文本和UI元素对低视力、色盲、年龄相关视力下降和情境性障碍（如强光）用户可读。它也通过提高可读性使普通视力用户受益。
颜色组合不通过WCAG意味着什么？
∨
不通过WCAG意味着前景色和背景色之间的对比度太低，视觉障碍用户可能无法可靠阅读文本。工具会显示您的组合具体不通过哪些级别（AA普通文本、AA大文本、AAA普通文本、AAA大文本）。使用推荐颜色功能查找无障碍替代方案。
这个工具可以用于移动应用设计吗？
∨
当然可以！WCAG对比度要求适用于所有数字内容，包括移动应用、网站、电子邮件和文档。相同的对比度比例可确保所有设备上的可读性。测试移动应用的文本颜色、按钮颜色和UI元素颜色，确保无障碍合规。
AA和AAA合规有什么区别？
∨
AA是大多数国家网站和数字内容的最低法律要求。AAA是提供最佳可读性的金标准。虽然AA合规通常足以满足法律目的，但追求AAA可确保您的内容对尽可能多的用户无障碍。某些政府和教育机构要求AAA合规。
如何修复低对比度问题？
∨
提高对比度的方法：1）加深前景色或提亮背景色，2）提亮前景色或加深背景色，3）使用推荐颜色功能查找合规替代方案，4）考虑使用纯色而非渐变或覆盖层，5）对于图片，添加半透明覆盖层确保文本可读性。
这个工具可以离线使用吗？
∨
可以！所有对比度计算完全在浏览器中使用JavaScript执行，不会发送任何数据到服务器。工具在首次页面加载后可离线使用，非常适合在没有网络访问的情况下测试颜色组合。
支持哪些颜色格式？
∨
工具支持多种颜色格式：十六进制（如#FF5733）、RGB（如rgb(255, 87, 51)）和HSL（如hsl(14, 100%, 60%)）。您也可以使用可视化颜色选择器直观地选择颜色。所有格式在内部转换为sRGB进行准确的对比度计算。
这个工具与专业软件相比准确吗？
∨
本工具使用与专业无障碍测试工具（如axe、WAVE和Colour Contrast Analyser）完全相同的WCAG 2.1对比度公式。计算在数学上完全相同。唯一的区别可能在于颜色选择器的精度，但实际用途中结果等同于行业标准工具。