WCAG AA 与 AAA 对比度检查工具

按 WCAG 2.2 AA 和 AAA 标准检查颜色对比度，预览字体大小并寻找更易读的替代颜色。

将指针移到字段上或选中字段即可查看帮助。按 Escape 关闭。

前景色背景不透明画布

使用 HEX、RGB、RGBA 或 HSL。透明颜色会合成在不透明画布上。

5.84:1

阈值判定使用完整精度的比率，而非四舍五入后的显示值。

WCAG 2.2
等级	使用	SC	最小值	结果
AA	普通文本	1.4.3	4.5:1	通过
AA	大号文本	1.4.3	3:1	通过
AAA	普通文本	1.4.6	7:1	未通过
AAA	大号文本	1.4.6	4.5:1	通过
AA	界面组件与图形	1.4.11	3:1	通过

预览文本字体大小（CSS px）粗体

Aa — fiokit.

普通文本: AA ✓ · AAA ✗

大号文本：至少 24 CSS px，或粗体至少 18.67 CSS px（14 pt）。

建议前景色的目标报告

WCAG 2.2
#155bdf / #ffffff (#ffffff)
5.8433:1
AA 普通文本 (SC 1.4.3): PASS — 4.5:1
AA 大号文本 (SC 1.4.3): PASS — 3:1
AAA 普通文本 (SC 1.4.6): FAIL — 7:1
AAA 大号文本 (SC 1.4.6): PASS — 4.5:1
AA 界面组件与图形 (SC 1.4.11): PASS — 3:1

本工具检查颜色组合，不检查完整的 WCAG 合规性。请另行评估相邻颜色、交互状态及实际内容。

W3C — SC 1.4.3 · SC 1.4.6 · SC 1.4.11

使用方法

设置前景色、背景色和不透明画布。AA 与 AAA 结果会即时更新。可尝试字体大小和粗细，应用建议色或下载报告。

实用示例

颜色

#155bdf

常见问题

输入内容会发送到服务器吗？

不会。内容在当前浏览器中处理，不会发送到服务器或保存。

使用 WCAG AA 与 AAA 对比度检查工具需要注意什么？

分别报告文本和非文本的阈值。本颜色检查不能认证完整的 WCAG 合规性。