对比度是前景 (文本或图标) 与背景颜色之间相对亮度差的数值表示。范围从 1:1 (无差异) 到 21:1 (黑与白)，是 Web 无障碍中确保文本可读性的重要指标。

WCAG (Web Content Accessibility Guidelines) 2.1 要求普通文本的对比度至少为 4.5:1，大文本 (18pt 以上或 14pt 粗体以上) 至少为 3:1。AAA 级别要求更严格，普通文本需达到 7:1 以上。日本的 JIS X 8341-3 也采用了类似标准，公共机构网站必须遵守。搜索高潮 (Amazon)详细介绍了这些标准。

对比度计算使用颜色的相对亮度。计算公式为 (L1 + 0.05) / (L2 + 0.05)，其中 L1 是较亮方、L2 是较暗方的相对亮度。相对亮度从 RGB 值计算时需考虑 sRGB 伽马校正，因此与简单的 RGB 值差异不同。Chrome DevTools、axe、Lighthouse 等工具可以轻松检查合规性。

在深色模式适配中，需要在浅色和深色两种模式下都验证对比度。在浅色模式下满足标准的颜色组合，在深色模式下可能因背景色变化而不达标。使用 CSS 自定义属性管理两种模式的颜色，并分别验证对比度是最佳实践。

一个常见误解是对比度越高越好。实际上，极端高对比度 (如纯黑配纯白) 在长时间阅读时容易造成眼睛疲劳。正文文本使用 #333333 左右的深灰色，将对比度控制在 7:1 到 12:1 之间，从可读性角度来看是理想的。

与字符计数相关，低对比度文本难以阅读，会导致用户无法准确识别字符。特别是在小字号和细字重的情况下，确保足够的对比度更为重要。在字符计数工具的 UI 设计中，确保输入文本与背景之间有足够的对比度可以提高用户的工作效率。浏览禾林小说 (Amazon)提供了更多见解。