16.65:1
AA 通过AA（大） 通过AAA 通过
敏捷的棕色狐狸跳过了懒狗。
AaBbCcDdEeFf 0123456789 - 此颜色组合的文本预览。
功能说明
计算前景色与背景色之间的 WCAG 2.2 对比度比值，并对照无障碍阈值做出判定：正文 AA（≥ 4.5:1）、大号文字 AA large（≥ 3:1）以及 AAA（≥ 7:1）。数学部分是真正的相对亮度公式——每条 sRGB 通道先做线性化，再以 WCAG 系数合并，比值为 (lighter + 0.05) / (darker + 0.05)。
它接受 #rgb 和 #rrggbb 十六进制颜色（大小写不敏感，带不带前导 # 均可），同时显示三个阈值各自的通过/未通过徽章，并渲染一个实时预览面板——用你选定的颜色对绘制一句全字母句和一行字符/数字。100% 客户端运行。
使用方法
- 设置前景色：点击色块打开颜色选择器，或在文本框中输入十六进制值。
- 用同样的方式设置背景色。工具初始状态是
#e9e9f1叠在#07070b上——这是经过设计、直接通过 AAA 的一对。 - 点击交换互换两个颜色——便于同时检查主题的深底浅字与浅底深字两个方向。
- 阅读结果：比值（保留两位小数）加上 AA、AA large、AAA 三枚徽章，各为绿色（通过）或红色（未通过）。
- 查看下方的预览块——用所选颜色对渲染的文字——用自己的眼睛做判断。
- 任何一个值不是合法的十六进制颜色时，工具会显示错误并隐藏结果，直到你修正为止。
示例
由运行 src/lib/color.ts 中的 contrastRatio()（工具使用的同一个函数）验证：
#e9e9f1 on #07070b 16.65:1 AA pass · AA large pass · AAA pass (tool defaults)
#ffffff on #000000 21.00:1 AA pass · AA large pass · AAA pass (the maximum)
#f8fafc on #1e293b 13.98:1 AA pass · AA large pass · AAA pass
#abc on #000000 10.69:1 AA pass · AA large pass · AAA pass (3-digit shorthand works)
#767676 on #ffffff 4.54:1 AA pass · AAA fail (the classic "just barely AA" gray)
#777777 on #ffffff 4.48:1 AA fail · AA large pass (one notch darker fails AA)
#3b82f6 on #ffffff 3.68:1 AA fail · AA large pass (Tailwind blue-500 on white)#767676 与 #777777 这一对说明了为什么精确的数学胜过目测：1 个十六进制单位的差异就越过了 4.5:1 的 AA 线。