免费在线颜色对比度检查器，检测前景/背景色对比度，WCAG 2.1 AA/AAA标准，实时预览，纯前端本地计算。 | 无需注册 · 数据绝不上传服务器
零依赖·可离线使用在线WCAG色彩对比度检测 - AA/AAA标准，实时预览，纯前端本地计算
🎨 选择颜色
预览文字 Aa
这是一段示例文字，用于预览前景色和背景色的对比效果。
--
对比度比率
📋 WCAG 2.1 合规性
常见问题
Q1: 什么是WCAG对比度标准？
WCAG（Web内容无障碍指南）规定了文字与背景之间的最低对比度要求。AA级要求普通文字对比度≥4.5:1，大文字≥3:1；AAA级要求普通文字≥7:1，大文字≥4.5:1。这些标准确保视力障碍用户也能正常阅读网页内容。
Q2: 对比度比率是如何计算的？
对比度比率 = (L1 + 0.05) / (L2 + 0.05)，其中L1是较亮色的相对亮度，L2是较暗色的相对亮度。相对亮度根据RGB各通道的sRGB值计算。比率范围从1:1（无对比）到21:1（最大对比，黑底白字）。
Q3: 什么是大文字和普通文字？
WCAG定义的大文字为：粗体≥14pt（18.5px）或正常≥18pt（24px）。普通文字是小于以上尺寸的文字。大文字的对比度要求较低，因为大尺寸本身就更容易阅读。
颜色对比度检查器的计算逻辑
本工具的核心计算逻辑：
sRGB= [r, g, b].map(function(c) { c = c / 255
前景色（文字颜色）等参数详解
- 前景色（文字颜色）
- 背景色
- #000000
- #ffffff