无障碍调色板生成器,免费

构建调色板并即时查看哪些组合符合 WCAG 2.2 AA(4.5:1)和 AAA(7:1)对比度要求。每一对颜色都会自动测试。

您的调色板

对比度矩阵

点击「检查所有组合」以生成对比度矩阵。

可用对

运行检查以查看通过的对。

📚 学术基础与来源

此工具适用的人群

充足的颜色对比度对视力障碍者、色觉障碍者(CVD)和存在与年龄相关的视觉问题者至关重要。世卫组织估计全球至少有 22 亿人患有近视或远视障碍(WHO,2019)。Owsley(2011)的研究表明,对比敏感度随年龄显著下降,使得高对比度设计对老年人尤为重要。CVD 在全球影响约 3 亿人(Colour Blind Awareness)。设计师、开发者和品牌团队使用此工具确保调色板符合最低 WCAG 对比度要求,并为这些群体保持可用性。

WCAG 2.2 对比度要求

  • CS 1.4.3(最小对比度,AA 级):普通文本需要 ≥ 4.5:1 的对比度。大字文本(18pt+ 或粗体 14pt+)需要 ≥ 3:1。
  • CS 1.4.6(增强对比度,AAA 级):普通文本需要 ≥ 7:1 的对比度。大字文本需要 ≥ 4.5:1。
  • CS 1.4.11(非文本对比度,AA 级):UI 组件和图形对象需要与相邻颜色有 ≥ 3:1 的对比度。

学术参考

  • W3C (2023).「Web Content Accessibility Guidelines (WCAG) 2.2.」w3.org/TR/WCAG22 · 定义了对比度阈值(4.5:1、7:1、3:1)以及此工具所用的相对亮度计算算法。
  • Owsley, C. (2011).「Aging and vision.」Vision Research, 51(13), 1610–1622。· 记录由于光学和神经变化,对比敏感度随年龄显著下降,强调了高对比度设计对老龄人群的重要性。
  • 世界卫生组织(2019).World Report on Vision. · 确立全球至少有 22 亿人患有视力障碍,低视力和老花眼是最普遍的形式。
  • Legge, G.E. (2007).Psychophysics of Reading in Normal and Low Vision. Lawrence Erlbaum Associates。· 关于对比度、字号和间距对低视力者阅读表现影响的奠基性研究。
  • Arditi, A. & Faye, E. (2004).「Monocular and binocular letter contrast sensitivity and letter acuity in a diverse ophthalmologic practice.」Optometry and Vision Science, 81(4), 287–292。· 展示对比敏感度作为功能性视觉指标的临床重要性。

算法

相对亮度按 WCAG 2.2 定义计算:sRGB 通道值先被线性化(去除伽马校正),然后根据 ITU-R BT.709 加权(0.2126 R + 0.7152 G + 0.0722 B)。对比度 = (L较亮 + 0.05) / (L较暗 + 0.05)。

免责声明

此工具使用 WCAG 2.2 规定的算法计算对比度。达到数学上的对比度阈值是可读性的必要条件但不是充分条件 · 字体粗细、字号、抗锯齿和显示器校准等因素也影响可读性。WCAG 合规要求评估所有成功标准,而不仅仅是对比度。此工具不提供法律建议。如需正式的无障碍审计,请咨询合格的专业人员。

相关工具

对比度检查器 色盲模拟器 颜色转换器 WCAG 标题检查器