简化您的工作流程:搜索 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地址查找srt时间偏移网址提取器太阳、月亮与上升星座计算器 🌞🌙✨MAC地址生成器相对标准偏差计算器血糖转换器定期存款计算器质数检查器彩票号码生成器百分比折扣计算器英尺英寸转换为厘米音频提取器CAGR计算器HEX计算器VAT计算器两点间距离计算器SHA256 哈希生成器样本量计算器MAC 地址分析工具随机选择器分数计算器音频分割器FPS 转换器毛利率计算器文本转SQL列表转换器随机分组生成器图片打码工具比例计算器合并视频英尺到米转换器随机超能力生成器多项式展开计算器kg到lbs转换器月亮星座计算器二进制计算器视频转图片提取器罗马数字转换器cpm计算器SRT转为TXT工具利润计算器磅转千克转换器年龄计算器随机扑克牌生成器我的生肖是什么?百分比变化计算器随机字符串生成器百分比计算器反向文字最简分数计算器MD5哈希生成器视频分割器卡方检验计算器宏量营养素计算器 - 确定您的每日营养素需求AI标点符号添加器为图片添加文字斜边计算器阶乘计算器t检验计算器不可见字符移除器随机锦标赛对阵生成器行数统计工具质数因子计算器GIF 制作器圆柱体体积计算器 高精度真心话大冒险生成器随机IMEI生成器One Rep Max (1RM) 计算器随机数字选择器年金现值计算器商和余数计算器平方根计算器英寸到厘米转换器随机颜色生成器SRT合并工具厘米到英尺和英寸转换器工资转换计算器最小公倍数计算器随机名字选择器Log Base 10 计算器圆计算器箱线图生成器对数计算器组合计算器ASCII艺术生成器Bar to PSI 转换器图片分割器平均绝对离差 (MAD) 计算器e的前n位数卧推计算器我的星座是什么?按位计算器最大公因子计算器生命道路号码计算器美国通货膨胀计算器花样字体生成器随机域名生成器先付年金终值计算器十六进制到十进制转换器圆形面积计算器随机声音频率生成器随机和弦生成器随机装备生成器随机扑克手牌生成器随机国际象棋开局生成器随机RPG角色生成器奇异值分解SVD计算器基尼系数计算器马尔可夫链稳态分布计算器鸽巢原理计算器斯特林数计算器错排 子阶乘计算器卡特兰数生成器图度数序列验证器最小生成树计算器迪杰斯特拉最短路径计算器幻方生成器快乐数计算器考拉兹猜想计算器曲率计算器收敛半径计算器矩阵LU分解计算器向量投影计算器格拉姆-施密特计算器球体方程计算器点到平面距离计算器三角形垂心计算器三角形重心计算器鞋带公式计算器连分数计算器模乘逆元计算器扩展欧几里得算法计算器欧拉函数计算器中国剩余定理计算器韦恩图生成器3集合集合论计算器真值表生成器人类与蚂蚁体重换算器猫咪卡路里计算器灯泡节省计算器淋浴费用计算器比特币挖矿电费计算器卫生纸价值计算器Instagram用户ID查询键盘里程计算器流行语宾果生成器病假概率计算器实际时薪计算器咖啡vs睡眠计算器邮件回复时间计算器FIRE计算器通勤浪费时间计算器会议成本计时器厕所工资计算器kakuro生成器聪聪数独生成器 算独数织生成器-picross24点游戏求解器与训练器数独生成器与求解器奶酪拼盘计算器巧克力喷泉计算器鸡尾酒ABV计算器意大利面分量计算器啤酒冷却时间计算器墨西哥卷饼吧计算器烧烤计算器咖啡因过量计算器披萨派对规划器婚礼酒水计算器乐高积木房屋计算器爆米花填充房间计算器硬币坠落冲击计算器穿越地球坠落计算器香蕉辐射计算器仓鼠发电计算器传送错误率计算器动能烤鸡计算器氦气球升力计算器僵尸生存时间计算器Googlebot抓取大小检测器停车比率计算器圣诞树计算器吸血鬼末日计算器披萨价值计算器柠檬水摊位计算器随机美国州生成器随机借口生成器随机活动生成器随机鸡尾酒配方生成器随机电影选择器随机俳句生成器随机写作提示生成器随机用户画像生成器随机虚假地址生成器随机端口号生成器随机 NanoID 生成器随机PIN生成器电池续航计算器PCB走线宽度计算器电压降计算器欧姆定律计算器电阻色环计算器.htaccess 重定向生成计算器SVG优化器网站图标生成器crontab表达式生成器SQL格式化工具cURL转JSON转换器JWT解码器JSON转YAML转换器酵母换算计算器烘焙烤盘尺寸转换器面团水合率计算器面包百分比计算器十字绣尺寸计算器布料计算器毛线计算器盐水与盐度计算器咖啡冲泡比例计算器自酿啤酒酒精度计算器蜡烛蜡香精油计算器皂化值碱液计算器 (SAP)打印尺寸分辨率计算器 (DPI/PPI)黄金时刻和蓝调时刻计算器景深 (DoF) 计算器骰子概率计算器植物间距计算器比例模型换算计算器水族箱底砂计算器水族箱容量和养鱼密度计算器转盘抽奖骰子滚轮抛硬币石头剪刀布生成器神奇8号球随机ip地址生成器随机时间生成器随机日期生成器随机坐标生成器随机用户代理生成器随机信用卡生成器随机 JSON 生成器随机国家生成器随机调色板生成器随机表情符号生成器随机餐点生成器高斯分布生成器点值计算器日复利计算器马丁格尔策略计算器凯利公式计算器止损止盈计算器斐波纳契扩展计算器枢轴点计算器加密货币杠杆计算器聪美元转换器加密货币套利计算器无常损失计算器期权盈利计算器隐含波动率计算器期权希腊值计算器布莱克-舒尔斯计算器破产风险计算器做空盈亏计算器保证金追缴计算器仓位规模计算器股票平均成本计算器文本列提取器列表差异计算器Zalgo文本生成器隐形文本生成器