颜色对比度检查器
计算前景色与背景色的对比度，查看 WCAG 文本及界面颜色阈值。
切换语言会开始新的会话。请先保存结果。
正在加载工具…
如何使用
输入或选择前景色和背景色，查看对比度及普通文本、大文本和界面元素的检查结果，可试用替代前景色。
限制与检查
此工具只检查一对平面颜色，不能证明整个页面符合无障碍或法律要求。渐变和图像背景应检查最低对比度区域。
计算前景色与背景色的对比度，查看 WCAG 文本及界面颜色阈值。
切换语言会开始新的会话。请先保存结果。
输入或选择前景色和背景色，查看对比度及普通文本、大文本和界面元素的检查结果，可试用替代前景色。
此工具只检查一对平面颜色，不能证明整个页面符合无障碍或法律要求。渐变和图像背景应检查最低对比度区域。
前景（文本）
RGB: 30, 41, 59
HSL: 217°, 33%, 17%
背景
RGB: 255, 255, 255
HSL: 0°, 0%, 100%
普通文本 (14px) — Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
大文本 (18pt / 24px) — 标题示例
粗体大文本（14pt 粗体/~18.67px 粗体）- 也算作大文本
14.63:1
对比度
| 适用场景 | 阈值 | WCAG AA | WCAG AAA |
|---|---|---|---|
| 普通文本 | ≥4.5:1 / ≥7:1 | ✓ 通过 | ✓ 通过 |
| 大文本 （18pt+ 或 14pt 粗体） | ≥3:1 / ≥4.5:1 | ✓ 通过 | ✓ 通过 |
| 用户界面组件 | ≥3:1 | ✓ 通过 | — |
对于文本，WCAG AA 对于正常尺寸使用 4.5:1，对于大文本使用 3:1。单独的颜色检查并不能建立完全的可访问性一致性。
对于文本对比度，AAA 将普通文本的阈值增加到 7:1，将大文本的阈值增加到 4.5:1。该工具检查颜色对比度，而不是法律合规性。
大文本的常规粗细至少为 18 磅，粗体至少为 14 磅。检查最终设计中的实际字体大小和粗细。
该工具根据线性化 RGB 值计算相对亮度，然后将（较亮亮度 + 0.05）除以（较暗亮度 + 0.05）。
如果文本出现在渐变、图像或图案上，请检查其最低对比度区域。单个平面颜色对无法代表该背景的每个部分。