# 颜色对比度检查器

根据 WCAG 2 和 APCA 检查文本颜色与背景颜色之间的对比度。此检查器根据相对亮度计算 WCAG 2 对比度，报告普通文本、大号文本以及 UI 图形是否通过 AA 和 AAA 标准，并提供 APCA 亮度对比值及其适用场景说明。适合构建无障碍界面的设计师和开发者。

## 常见问题

### WCAG 各级别代表什么？

AA 级要求普通文本达到 4.5:1，大号文本达到 3:1（成功准则 1.4.3）；AAA 级要求分别达到 7:1 和 4.5:1（1.4.6）。用户界面组件和有意义的图形与相邻颜色之间需要达到 3:1（1.4.11）。此检查器会报告是否通过这五项阈值。

### 什么算大号文本？

WCAG 将大号文本定义为至少 18 磅的常规字重，约合 24 CSS 像素；或至少 14 磅的粗体，约合 18.66 CSS 像素。更小的文本都属于普通文本，需要达到更高的对比度。

### 为什么 4.499:1 的对比度未通过 AA？

WCAG 阈值是精确值，因此即使某个对比度四舍五入后为 4.5，只要实际值低于 4.5 就无法通过。此检查器会比较未舍入的比值，并将其截断为两位小数显示，因此显示值不会显得比实际值更高。

### 什么是 APCA？

可访问性感知对比算法（APCA）是为 WCAG 3 草案开发的对比度计算方法。它会模拟感知到的亮度对比，对文本和背景采用不同的处理方式，并返回约为 -108 到 106 的亮度对比值 Lc。它尚未纳入任何已发布的 WCAG 标准，因此合规性请以 WCAG 2 结果为准，并将 APCA 作为额外检查。

### 为什么 APCA 值有时是负数？

APCA 会考虑极性：正值表示浅色背景上的深色文本，负值表示深色背景上的浅色文本。指导建议使用绝对值，因此 Lc -75 和 Lc 75 属于同一等级。

### APCA 指导等级是如何确定的？

这些等级遵循 APCA 青铜级简单模式：正文文本首选 Lc 90，最低为 Lc 75；其他内容文本为 Lc 60；标题和大号文本为 Lc 45；占位符等需要快速辨读的文本为 Lc 30；非文本元素为 Lc 15。字号和字重仍然会产生影响，因此这些等级只是起点，并非最终判定。

### 实现的是哪个版本的 APCA？

采用 APCA-W3 常量，版本 0.0.98 G，修订版 4g；对 sRGB 通道使用简单的 2.4 次幂，对黑色进行柔性钳制，并截断低对比度值。黑字白底的结果约为 Lc 106.0，白字黑底约为 Lc -107.9，与参考实现一致。

### 可以输入哪些颜色格式？

支持带或不带 # 的十六进制代码、CSS 颜色名称、rgb()、hsl()、hwb()、lab()、lch()、oklab()、oklch()、color() 等颜色空间（例如 display-p3），以及 cmyk()。由于这两种公式都是针对 sRGB 屏幕颜色定义的，超出 sRGB 色域的颜色会先映射到 sRGB。

### 如何处理透明颜色？

测量前，半透明文本颜色会像浏览器绘制时那样与背景混合。半透明背景则先与白色混合。结果会列出实际参与对比的不透明文本颜色和背景颜色。

### 两种颜色的顺序重要吗？

对于 WCAG 2，顺序并不重要，因为较亮与较暗亮度的比值无论顺序如何都相同。对于 APCA，顺序很重要，因为文本和背景的权重不同，所以请在第一个字段中输入文本颜色，在第二个字段中输入背景颜色。

在这里投放广告？

[给我们发邮件](mailto:hi@dennn.is?subject=%E5%9C%A8%20OneClick%20Pro%20%E4%B8%8A%E6%8A%95%E6%94%BE%E5%B9%BF%E5%91%8A)

[广告 适用于 WordPress 的智能体就绪型插件套件。](https://sleekwp.com/?ref=oneclickpro)