完整指南: 颜色空间、色彩转换与 Web 无障碍规范
1. 什么是色彩空间 (HEX, RGB, HSL, CMYK)?
RGB 与 HEX 用于数字屏幕发光显示,HSL 符合人类直觉感知,CMYK 专用于物理印刷减色模式。
2. WCAG 2.1 无障碍标准与对比度比率
Web 内容无障碍指南要求正文对比度达到 4.5:1 (AA 级) 及 7:1 (AAA 级) 以确保全人群可读性。
3. 配色和谐理论: 互补、近似与三角色
通过 360 度色相环的几何夹角生成视觉上自然协调的专业配色方案。
4. 现代 CSS 创新: OKLCH 与 color-mix()
OKLCH 解决了 HSL 感官亮度不均的问题,在现代浏览器中实现极其平滑自然的渐变渲染。
常见问题解答 (FAQs)
为什么在 CSS 中推荐使用 HSL?
只需微调亮度 (L) 即可无缝切换明暗主题,无需重新计算色相 (H)。
色彩对比度如何计算?
根据 W3C 公式计算相对亮度比率 (L1 + 0.05) / (L2 + 0.05)。