对比度
对比度（也叫颜色对比度、对比度比值）指两种颜色在亮度上的差异程度，最常用来衡量文字与背景是否足够清晰可读。它以「比值」表示，范围从 1:1（两色完全相同）到 21:1（纯黑配纯白）。这个值不是简单比较 RGB 或十六进制的数值差，而是先把两色各自算出「相对亮度」（对 sRGB 分量做伽马校正后按 0.2126R + 0.7152G + 0.0722B 加权），再代入 (L1 + 0.05) / (L2 + 0.05)，其中 L1 是较亮的一方。
它的主要用途是无障碍设计。WCAG 规定：正常字号文字需达到 AA 级 4.5:1、AAA 级 7:1；大号文字（约 18pt 或 14pt 加粗以上）门槛降到 3:1 和 4.5:1；图标、输入框边框等非文字 UI 元素至少 3:1。
使用中常见的几个误区：
- 颜色「看着差别大」不等于对比度高。红配绿、亮黄配白这类组合色相差异明显，但亮度接近，比值往往不达标。
- 对比度只跟亮度有关，与色相、饱和度没有直接关系。
- 半透明文字、渐变或图片背景会改变实际叠加后的颜色，应按最终呈现的像素颜色来计算。
常见问题
对比度比值和 hex 颜色值的差有关系吗？
基本没有直接关系。比值是基于相对亮度算出来的，两个 hex 相差很大的颜色（比如红和绿）亮度可能接近、对比度反而很低；相近的 hex 也可能亮度差很大。所以不能靠肉眼或数值差判断，要实际计算。
WCAG AA 对正文的最低对比度要求是多少？
正常字号是 4.5:1，大号文字（约 18pt 或 14pt 加粗以上）是 3:1。图标、按钮边框等非文字的 UI 组件则至少 3:1。
深色模式也需要单独检查对比度吗？
需要。深色和浅色是两套独立配色，浅色下达标不代表深色下也达标，每套主题都要单独验证，尤其是深色背景上的灰色次要文字容易不合格。