在线工具集

WCAG 颜色对比度检测

WCAG 颜色对比度检测工具,支持十六进制 / RGB / HSL 输入,实时计算对比度比值,按 AA 普通文本(4.5:1)、AA 大字(3:1)、AAA 普通文本(7:1)、AAA 大字(4.5:1)显示通过 / 失败徽章,附等级提升建议色。

对比度
AA 普通 (4.5:1)
AA 大字 (3:1)
AAA 普通 (7:1)
AAA 大字 (4.5:1)
在「背景色」上展示「前景色」

普通文字 — 这是 16px 普通字号正文示例。The quick brown fox.

大字示例 (18pt) — Lorem ipsum dolor sit.

超大标题 24px — 标题展示

反转:在「前景色」上展示「背景色」

普通文字 — 这是 16px 普通字号正文示例。The quick brown fox.

大字示例 (18pt) — Lorem ipsum dolor sit.

建议:通过 AA 4.5:1 的最接近前景色

WCAG 对比度门槛

怎么修复对比度不足

常见做法:把前景色调暗(深色文字配浅色背景)或调亮(浅色文字配深色背景)。本工具的「建议」算法沿 sRGB 明度方向二分搜索最接近原色但通过 AA 的方案。