颜色对比度检查
UpBox优盒工具箱，免费在线颜色对比度检查工具，按 WCAG 2.1 公式计算前景与背景对比度，判定正文、大字号与图标是否达到 AA / AAA。
无需注册 · 数据不上传No sign-up · nothing uploaded
颜色Colors
这段文字用当前配色显示，正文 16px，大字号 24px。
数值越大越清晰，正文低于 4.5:1 建议加深或提亮
按 WCAG 2.1 的相对亮度公式计算；大字指 18pt 及以上，或 14pt 加粗。判定只针对颜色组合，不替代完整的无障碍检查
工具介绍
对比度不是审美问题，而是可读性的下限。这里按 WCAG 2.1 的相对亮度公式算出一个比值，再逐项对照正文、大字号与图标的达标线。 Contrast is a readability floor, not a matter of taste. This computes the WCAG 2.1 relative-luminance ratio and checks it against the thresholds for body text, large text and UI elements.
正文 AA 要求 4.5:1、AAA 要求 7:1；18pt 以上或 14pt 加粗的大字放宽到 3:1 与 4.5:1。图标与边框这类非文本元素按 3:1 判定。 Body text needs 4.5:1 for AA and 7:1 for AAA, while large text at 18pt or 14pt bold relaxes to 3:1 and 4.5:1. Non-text elements such as icons and borders use 3:1.
- 实时对比度Live ratio
- AA / AAA 判定AA / AAA checks
- 文字实时预览Live preview
- 取色器与十六进制Picker and hex
- 一键交换Swap colors
使用说明
- 填前景色与背景色。Set both colors.
- 查看对比度比值。Read the ratio.
- 对照五项判定。Check the five badges.
- 按不达标项调色。Adjust the failing pair.