简化您的工作流程:搜索 miniwebtool。
添加插件
主页 > 杂项 > 颜色工具 > 颜色对比检查器
 

颜色对比检查器

检查文本与背景颜色之间的颜色对比度。测试 WCAG 2.x AA/AAA 对普通文本和大文本的合规性,提供实时预览、颜色建议及详细的无障碍分析。

颜色对比检查器
实时预览
敏捷的棕色狐狸跳过
普通大小 (16px) 的标准正文文本。这是大多数用户在您的网站或应用程序上阅读的内容。
小文本 (13px):标注、脚注和次要信息也需要良好的对比度。
按钮 带下划线的链接 输入框

Embed 颜色对比检查器 Widget

颜色对比检查器

颜色对比检查器帮助设计师、开发人员和无障碍专家确保颜色组合符合 WCAG 2.x 无障碍标准。文本和背景颜色之间适当的对比度对于可读性至关重要,特别是对于低视力或色觉障碍用户而言。

什么是颜色对比度?

颜色对比度衡量两种颜色之间感知的亮度差异。其范围从 1:1(颜色相同,无对比)到 21:1(最大对比:白底黑字)。该比例是根据两种颜色的相对亮度值,使用 WCAG 2.x 公式计算得出的。

WCAG 对比度要求

Web 内容无障碍指南 (WCAG) 为颜色对比度定义了两个符合性级别:

元素类型WCAG AAWCAG AAA
普通文本 (<18pt / <14pt 加粗)4.5 : 17 : 1
大文本 (≥18pt / ≥14pt 加粗)3 : 14.5 : 1
UI 组件和图形3 : 1

什么算作“大文本”?

WCAG 将大文本定义为至少 18 磅 (24px) 常规字重,或至少 14 磅 (18.66px) 加粗字重。大文本的对比度要求较低,因为较大的字符自然更容易阅读。

如何使用此工具

  1. 输入您的颜色: 使用颜色选择器选取前景色(文本)和背景色,或输入十六进制代码,也可以点击预设示例。
  2. 查看实时预览: 即时查看您的颜色在实际 UI 元素(标题、正文、按钮、链接、表单输入框)上的效果。
  3. 点击“检查对比度”: 获取准确的对比度数值以及普通文本、大文本和 UI 组件的 WCAG 合规状态。
  4. 应用建议: 如果您的颜色不符合标准,请使用自动建议功能来查找最接近的符合无障碍要求的替代方案。

理解结果

对比度

主数值(例如 8.59:1)告诉您两种颜色的视觉差异程度。数值越高,可读性越好。至少 4.5:1 的比例可确保大多数用户能够舒适地阅读普通大小的文本。

综合等级

  • AAA (优秀): 通过所有 WCAG 标准,包括增强标准 (7:1+)。达到最佳无障碍程度。
  • AA (良好): 通过标准要求 (4.5:1+)。符合大多数地区的法律要求。
  • AA 大文本 (部分通过): 仅通过大文本或 UI 组件标准 (3:1+)。普通文本未通过。
  • 失败 (差): 不符合任何 WCAG 对比度标准。对于许多用户来说,文本将难以阅读。

颜色建议

当您的颜色不符合对比度要求时,该工具会通过调整亮度同时保留色相和饱和度,来建议最接近的无障碍颜色。您可以点击一次即可应用建议。

为什么颜色对比度很重要

  • 法律合规: 许多国家法律要求符合 WCAG AA 标准(如 ADA、Section 508、EN 301 549、EAA)。
  • 用户体验: 良好的对比度可以提高所有用户的可读性,而不仅仅是残障人士。
  • SEO 影响: 搜索引擎越来越多地将无障碍性纳入排名因素。
  • 受众覆盖: 大约每 12 名男性中就有 1 人,每 200 名女性中就有 1 人患有色觉障碍。

选择无障碍颜色的技巧

  • 从足够的对比度开始,然后优化设计——事后修复对比度会更加困难。
  • 避免在没有测试的情况下在彩色背景上放置彩色文字。即使看起来“截然不同”的颜色也可能无法通过对比度检查。
  • 白色背景上的浅灰色文本是最常见的无障碍失败案例之一。
  • 在设计过程中使用此工具,而不仅仅是在审计期间——尽早发现问题可以节省大量返工时间。
  • 不要仅依靠颜色来传达信息;也要使用形状、图案或标签。

常见问题解答

什么是颜色对比度?

颜色对比度衡量两种颜色之间感知亮度的差异。其范围从 1:1(无对比,颜色相同)到 21:1(最大对比,白底黑字)。该比例使用 WCAG 2.x 公式计算:(L1 + 0.05) / (L2 + 0.05),其中 L1 是较亮颜色的相对亮度,L2 是较暗颜色的相对亮度。

WCAG AA 合规需要多少对比度?

WCAG AA 要求普通文本(18pt 以下或 14pt 加粗以下)的最小对比度为 4.5:1,大文本(18pt+ 或 14pt+ 加粗)的最小对比度为 3:1。对于非文本 UI 组件和图形对象,最小值为 3:1。

WCAG AA 和 AAA 有什么区别?

WCAG AA 是标准合规级别,要求普通文本为 4.5:1,大文本为 3:1。WCAG AAA 是增强级别,要求普通文本为 7:1,大文本为 4.5:1。大多数无障碍法律要求达到 AA 级,而 AAA 级是推荐做法,通常不强制要求整个网站都达到该标准。

WCAG 指南中什么是大文本?

在 WCAG 指南中,大文本定义为至少 18 磅 (24px) 的常规字重,或至少 14 磅 (约 18.66px) 的加粗字重。大文本的对比度要求较低,因为较大的字符在较低对比度下也更容易阅读。

如何修复低颜色对比度?

修复低颜色对比度的方法:(1) 加深文字颜色或减浅背景颜色,反之亦然。(2) 使用我们的颜色建议功能,它会自动寻找最接近的通过颜色。(3) 增加字体大小以符合对比度要求较低的“大文本”标准。(4) 避免仅依靠颜色来传达信息。

颜色对比度只适用于文本吗?

不是。WCAG 2.1 成功标准 1.4.11 要求非文本元素(包括表单输入框边框、图标和对理解内容至关重要的图形对象)的最小对比度为 3:1。这适用于按钮、表单字段和焦点指示器等 UI 组件。

更多资源

引用此内容、页面或工具为:

"颜色对比检查器" 于 https://MiniWebtool.com/zh-cn/颜色对比检查器/,来自 MiniWebtool,https://MiniWebtool.com/

由 miniwebtool 团队开发。更新日期:2026年2月11日

其他相关工具:

颜色工具:

常用工具:

随机信用卡生成器MAC地址查找相对标准偏差计算器百分比折扣计算器网址提取器相关系数计算器彩票号码生成器CAGR计算器t检验计算器英尺英寸转换为厘米HEX计算器VAT计算器MAC地址生成器毛利率计算器srt时间偏移样本量计算器比例计算器cpm计算器太阳、月亮与上升星座计算器 🌞🌙✨音频分割器斜边计算器定期存款计算器SHA256 哈希生成器分数计算器AI改写工具罗马数字转换器随机字符串生成器血糖转换器时间持续计算器年龄计算器SRT转为TXT工具百分比增长率计算器利润计算器音频提取器随机选择器英尺到米转换器卡方检验计算器合并视频标准偏差计算器 - 高精度英寸到厘米转换器图片分割器FPS 转换器视频转图片提取器MAC 地址分析工具kg到lbs转换器随机装备生成器美国通货膨胀计算器弧长计算器DOY日历多项式展开计算器AI标点符号添加器移除标点符号在线工具图片打码工具文本差异对比工具商和余数计算器npv计算器线性回归计算器频率与波长转换器平方根计算器图片压缩器厘米到英尺和英寸转换器磅转千克转换器圆计算器百分比变化计算器Log Base 10 计算器极限计算器相同字母异序词生成器对数计算器年金现值计算器随机颜色生成器调整视频速度百分比计算器最小公倍数计算器月亮星座计算器为图片添加文字URL Slug 生成器随机IMEI生成器杀手数独生成器跑步配速计算器One Rep Max (1RM) 计算器复合增长率计算器椭圆周长计算器随机生日生成器Facebook用户ID查询MD5哈希生成器二进制计算器年度天数计算器 - 今天是今年的第几天位数计算器积分计算器百分比增加计算器质数检查器随机坐标生成器箱线图生成器随机扑克牌生成器Cohen's d 计算器视频分割器WAR计算器互补误差函数计算器半衰期计算器变异系数计算器YouTube频道统计TikTok收益计算器社交媒体图片尺寸指南Instagram字体生成器Twitter/X 字符计数器YouTube评论抽选器YouTube标签提取器YouTube缩略图下载器youtube收益估算器TikTok互动率计算器Instagram 互动率计算器AI Token 计数器AI文章大纲生成器AI标语生成器AI 话题标签生成器AI邮件写作工具AI博客标题生成器AI文本人性化工具AI内容检测器死链检查器Hreflang 标签生成器重定向检查器域名信任度检查器页面速度检查器标题分析器DNS查询WHOIS查询域名年龄查询器Open Graph检测器XML网站地图生成器robots.txt生成器Schema标记生成器Webhook测试器ASCII码表API测试工具IP子网计算器CSS盒阴影生成器图片Base64转换器HTML转Markdown转换器Markdown编辑器CSV转JSON转换器YAML格式化/验证器HTML美化器CSS美化工具javascript压缩/美化工具正则表达式测试器JSON格式化和验证工具狗预期寿命计算器宠物保险计算器生食喂养计算器狗狗怀孕计算器巧克力毒性计算器幼犬体重预测器多分数计算器狗粮计算器新鲜香草转干香草转换器黄油转食用油转换器烤箱转空气炸锅转换器低温慢煮计算器酸面团计算器披萨面团计算器火鸡烹饪时间计算器烟熏肉类计算器杯到克转换器食谱营养计算器烹饪单位转换器食谱分量调整器孕期热量计算器胎龄计算器母乳喂养热量计算器婴儿生长百分位计算器孕期体重增长计算器配速区间计算器垂直弹跳计算器高尔夫差点计算器保龄球计分计算器铁人三项配速计算器马拉松配速计算器力量标准计算器军队体脂计算器步数距离计算器游泳配速计算器骑行速度计算器心脏病风险计算器净碳水化合物计算器碳水化合物计算器瘦体重计算器体型计算器血型计算器生物年龄计算器预期寿命计算器身高百分位数计算器血压解读器肌酐清除率计算器GFR计算器减重计算器间歇性禁食计算器生酮饮食计算器蛋白质摄入量计算器血液酒精浓度计算器理想体重计算器房屋净值计算器房屋翻新利润计算器房地产佣金计算器成交费用计算器租赁房产计算器租房vs买房计算器税等价收益率计算器赡养费计算器子女抚养费计算器遗产税计算器房产税计算器W-4预扣税计算器1099 税金计算器自雇税计算器资本利得税计算器退税估算器税率等级计算器所得税计算器比特币投资计算器加密货币盈亏计算器员工成本计算器企业估值计算器盈亏平衡计算器HELOC计算器FHA贷款计算器首付计算器房贷还清计算器应急基金计算器储蓄目标计算器预算计算器净资产计算器债务合并计算器债务偿还计算器个人贷款计算器商业贷款计算器平均成本法计算器股息再投资计算器股票盈亏计算器共同基金计算器SIP计算器RMD计算器养老金计算器社会保障福利计算器退休计算器Roth IRA计算器401k计算器货币转换器小费计算器连点成画生成器宾果卡生成器单词梯生成器单词拼字游戏生成器密码字谜生成器填字游戏制作器单词搜索谜题生成器数回谜题生成器桥梁谜题生成器不等式谜题生成器原根计算器RSA加密逐步模拟器欧拉特征计算器多边形对角线计算器圆锥展开图模板生成器函数奇偶性判断器傅里叶级数系数计算器龙格-库塔RK4方法计算器朗斯基行列式计算器矩阵迹计算器矩阵秩计算器随机声音频率生成器随机和弦生成器随机扑克手牌生成器随机国际象棋开局生成器随机RPG角色生成器奇异值分解SVD计算器基尼系数计算器马尔可夫链稳态分布计算器鸽巢原理计算器斯特林数计算器错排 子阶乘计算器卡特兰数生成器图度数序列验证器最小生成树计算器迪杰斯特拉最短路径计算器幻方生成器快乐数计算器考拉兹猜想计算器曲率计算器收敛半径计算器矩阵LU分解计算器向量投影计算器格拉姆-施密特计算器球体方程计算器点到平面距离计算器三角形垂心计算器三角形重心计算器鞋带公式计算器连分数计算器模乘逆元计算器扩展欧几里得算法计算器欧拉函数计算器中国剩余定理计算器韦恩图生成器3集合集合论计算器真值表生成器人类与蚂蚁体重换算器猫咪卡路里计算器灯泡节省计算器淋浴费用计算器比特币挖矿电费计算器卫生纸价值计算器Instagram用户ID查询键盘里程计算器流行语宾果生成器病假概率计算器实际时薪计算器咖啡vs睡眠计算器邮件回复时间计算器FIRE计算器通勤浪费时间计算器会议成本计时器厕所工资计算器kakuro生成器聪聪数独生成器 算独数织生成器-picross24点游戏求解器与训练器数独生成器与求解器奶酪拼盘计算器巧克力喷泉计算器鸡尾酒ABV计算器意大利面分量计算器啤酒冷却时间计算器墨西哥卷饼吧计算器烧烤计算器咖啡因过量计算器披萨派对规划器婚礼酒水计算器乐高积木房屋计算器爆米花填充房间计算器硬币坠落冲击计算器穿越地球坠落计算器香蕉辐射计算器仓鼠发电计算器传送错误率计算器动能烤鸡计算器氦气球升力计算器僵尸生存时间计算器Googlebot抓取大小检测器停车比率计算器圣诞树计算器吸血鬼末日计算器披萨价值计算器柠檬水摊位计算器随机美国州生成器随机借口生成器随机活动生成器随机鸡尾酒配方生成器随机电影选择器随机域名生成器随机超能力生成器随机俳句生成器随机写作提示生成器