颜色对比度检查器
开发者工具WCAG AA/AAA · 相对亮度
答案速览
颜色对比度检查器——WCAG AA/AAA · 相对亮度。相对亮度 L = 0.2126R + 0.7152G + 0.0722B（sRGB 先 gamma 展开）。
正文示例 Sample text
大字标题 Large heading
对比度比率
7.00:1
AAA
AA 正文 4.5:1
通过
AA 大字 3:1
通过
AAA 正文 7:1
通过
AAA 大字 4.5:1
通过
对比度定位
不达标
仅 AA 大字
AA
AAA
7.00:1 — AAA
WCAG 2.1 阈值对照
| 级别 | 正文 | 大字 | 当前判定 |
|---|---|---|---|
| AA | ≥ 4.5:1 | ≥ 3:1 | 通过 |
| AAA | ≥ 7:1 | ≥ 4.5:1 | 通过 |
大字 = ≥18pt（24px）或 ≥14pt（18.7px）粗体。非文本 UI（焦点框、控件边界）需 3:1。
计算步骤
- 1相对亮度：前景 0.0999、背景 1.0000（sRGB → 线性化 → 0.2126R+0.7152G+0.0722B）
- 2对比度 = (亮者 + 0.05) / (暗者 + 0.05) = 7.00:1
- 3WCAG 2.1：AA 级要求正常字 4.5:1、大字（≥18pt 或 14pt 粗体）3:1；AAA 级要求 7:1 / 4.5:1。
约 8% 男性有红绿色觉异常——永远不要只用颜色传达信息，配合图标/文字。对比度要求同样适用于 UI 组件边界（WCAG 1.4.11：焦点指示与控件边缘需 3:1）。
这个工具对你有帮助吗？
怎么用
- 粘贴或输入内容：在颜色对比度检查器中粘贴代码、文本或填写参数。
- 选择模式/选项：按需切换格式、规则或处理方式。
- 实时输出：处理结果即时显示，无需提交，数据不出浏览器。
- 一键复制：输出结果一键复制，直接粘贴到开发环境使用。
核心要点
- 相对亮度 L = 0.2126R + 0.7152G + 0.0722B（sRGB 先 gamma 展开）
- 对比度 = (L亮 + 0.05) ÷ (L暗 + 0.05)，范围 1:1 – 21:1
- AA 级：正文 ≥ 4.5:1，大字（≥18pt/14pt 粗）≥ 3:1；AAA 级：7:1 / 4.5:1
- 白上黑 = 21:1（最高）；纯白配纯黄 ≈ 1.07:1（几乎不可读）
原理与公式
WCAG 颜色对比度
相对亮度 L = 0.2126R + 0.7152G + 0.0722B（sRGB 先 gamma 展开）
对比度 = (L亮 + 0.05) ÷ (L暗 + 0.05)，范围 1:1 – 21:1
AA 级：正文 ≥ 4.5:1，大字（≥18pt/14pt 粗）≥ 3:1；AAA 级：7:1 / 4.5:1
白上黑 = 21:1（最高）；纯白配纯黄 ≈ 1.07:1（几乎不可读）
示例：#1e293b 配 #ffffff → 14.7:1，通过全部等级；#94a3b8 配 #ffffff → 约 2.9:1，仅大字 AA 勉强。
常见问题
颜色对比度检查器怎么用？
打开页面后在输入框中填入参数即可自动计算。WCAG AA/AAA · 相对亮度。修改任意输入结果自动更新。
转换结果准确吗？
是的。使用标准编解码算法（如RFC 4648、ECMA-262等），结果经过校验。
免费使用吗？需要注册吗？
完全免费，打开网页即用，无需注册、登录或下载任何软件。
处理的数据会上传到服务器吗？
不会。所有处理在浏览器本地完成，代码/文本数据不离开设备。
支持大文本处理吗？
支持常规大小的文本处理。超大文件可能受浏览器内存限制，建议分批处理。
支持手机使用吗？
支持。页面采用响应式设计，手机、平板、电脑均可正常使用。
相关工具
相关指南
来源与更新
依据RFC 4648、ECMA-262等国际标准规范。最近更新：2025-07
最近更新：
本页公式与内容经一键算团队复核，仅供学习参考，实际业务请以官方口径为准。
内容由一键算编辑团队维护并定期复核，更新与审核流程见编辑规范。
引用本页：一键算. 颜色对比度检查器[EB/OL]. https://www.yijiansuan.com/c/dev/contrast-check
本工具提供的结果仅供参考，不构成任何专业建议，请以官方核算为准。