格子岛

对比度检查器

检查文字与背景色是否达到 WCAG AA/AAA 标准。

Aa 示例
— 对比度

报告问题

Advertisement

A使用方法

  1. 01 选择文字颜色和背景颜色。
  2. 02 查看对比度比值与 AA/AAA 通过情况。
  3. 03 调整颜色直到 accessibility 徽章全部变绿。

Q常见问题

对比度需要达到多少？ ＋

WCAG 2.1 AA 级要求正常文字至少 4.5:1、大号文字至少 3:1；AAA 级分别提高到 7:1 和 4.5:1。

为什么要在意对比度？ ＋

约 8% 的男性存在色觉障碍，低对比文字在阳光下对所有人都不友好。提高对比度是成本最低的无障碍改进。

→相关工具

→ 颜色转换器 HEX、RGB、HSL 互转，附明暗色阶色板。 → CSS 渐变生成器 可视化设计线性渐变，一键复制 CSS。 → 年龄计算器 按年、月、日精确计算年龄，并显示距离下一个生日的天数。 → Base64 编解码 文本与 Base64 互转，完整支持 UTF-8 中文与 emoji。