颜色对比度检查
检查前景色与背景色的对比度,验证是否满足 WCAG AA/AAA 无障碍标准
使用说明
输入前景色(文字颜色)和背景色,工具自动计算 WCAG 对比度比值,并判定是否通过 AA(4.5:1)和 AAA(7:1)标准。支持 HEX、RGB、HSL 三种格式自动识别。顶部实时预览文字在背景色上的实际效果,四个判定卡片分别显示正常文字和大文字的 AA/AAA 通过状态。常用于无障碍审查、设计系统主题色验证、按钮文字可读性检查。
常见问题
什么是 WCAG 对比度?
WCAG(Web 内容无障碍指南)要求文字与背景之间有足够的亮度差异,确保视力障碍用户可读。AA 标准要求正常文字 ≥ 4.5:1,大文字 ≥ 3:1;AAA 标准更严格,要求 7:1 和 4.5:1。
AA 和 AAA 有什么区别?
AA 是无障碍合规的最低要求,大多数法规(如 ADA、欧洲无障碍法案)以此为准。AAA 是增强级别,对颜色对比要求更高,适合对可读性要求极高的场景(如医疗、政府网站)。
大文字的标准为什么更宽松?
大文字(18px 以上,或 14px 以上加粗)本身更易读,所以 WCAG 允许更低的对比度。正常文字 AA 要 4.5:1,大文字只需 3:1。