🎨 WCAG Contrast Check

Enter foreground and background colours to compute the WCAG 2.1 contrast ratio and see whether text passes the AA and AAA levels.

📐 计算公式 / 原理

CR = (L₁ + 0.05) / (L₂ + 0.05)，L = 0.2126R + 0.7152G + 0.0722B（sRGB 归一化并线性化后）

依据 WCAG 2.1：先将 sRGB 各通道归一化并按 gamma 线性化，再加权求相对亮度 L，两色亮度各加 0.05 后取比值。CR ≥ 4.5 为 AA（正文）、≥ 7 为 AAA；大字号阈值分别为 3 与 4.5。

前景色（文字色）

背景色

大号文字示例 (24px Bold)

中等文字示例 (18px Regular)

小号文字示例 (14px Regular) — The quick brown fox jumps over the lazy dog.

📚 深度解析：对比度检查（WCAG标准）

校验 #FFF 与 #767676 对比度

输入：前景 #767676、背景 #FFFFFF。处理：按 WCAG 相对亮度算对比度。输出：对比度约 4.54:1，达 AA 普通文本。

AA 和 AAA 怎么选？: 普通文本 AA 需 ≥4.5:1、AAA ≥7:1；大文本阈值更低。结果以浏览器实时计算为准，纯前端本地处理、数据不上传；生成的样式与代码仅作快速产出参考，正式项目请以设计系统、规范与浏览器实测为准。
生成的代码/图片能直接用吗？: 可直接复制使用，建议粘到项目后在浏览器实测微调；本工具只生成不托管。
会保存或上传我的内容吗？: 结果以浏览器实时计算为准，纯前端本地处理、数据不上传；生成的样式与代码仅作快速产出参考，正式项目请以设计系统、规范与浏览器实测为准。

⚠️ 使用说明与注意事项