THE DESIGN LAB
设计，动手就懂。
改变一个变量，观察一个结果。把看过的原则，变成自己的直觉。
EXPERIMENT 04 / CONTRAST
好看的浅灰色，真的看得清吗？
MAKE IT READABLE
颜色不同，不等于清楚
5.72:1WCAG 相对亮度对比度
普通文本 AA 通过
大文本 AA 通过
普通文本 AAA 未通过
LIVE PREVIEW 实时示例
YOUR COLOR PAIR看见，
看见，
才是理解的开始。
这是一段 16px 的普通正文。浅色不一定意味着轻盈，也可能意味着看不清。
Aa · 中文 · 0123456789
观察一下
普通文本 AA ≥ 4.5:1；大文本 AA ≥ 3:1。大文本通常为 ≥24 CSS px，或约 ≥18.67 CSS px 的粗体。本实验仅计算不透明纯色，结果不能代表整个页面的可访问性。查阅 WCAG 说明
接下来，看看完整界面如何运用这些原则。
进入案例拆解