是时候介绍这几个全新的CSS颜色函数了
💡
原文中文，约6100字，阅读约需15分钟。
📝
内容提要
CSS新增了hwb()、lch()、lab()、color()、color-mix()、oklch()、oklab()等颜色函数，支持自定义颜色空间、检测颜色空间、混合颜色，支持的浏览器有Chrome、Safari、Firefox，还支持数学函数，极大拓展了CSS的能力，但转变需要时间，需要更多的探索和实践。
🎯
关键要点
- CSS新增了多个颜色函数，包括hwb()、lch()、lab()、color()、color-mix()、oklch()、oklab()等。
- 这些颜色函数支持自定义颜色空间、检测颜色空间和混合颜色，兼容Chrome、Safari和Firefox等现代浏览器。
- hwb()色值是最早支持的颜色函数，基于RGB颜色模型的圆柱坐标表示，更符合人类直观认知。
- lch()和lab()函数基于CIE LAB颜色空间，提供更宽广的颜色范围，适合人类感知。
- color()函数允许使用不同的颜色空间显示颜色，支持的颜色空间包括display-p3、srgb等。
- color-mix()函数可以让两个颜色按指定比例混合，实用性强。
- oklch()和oklab()函数目前仅Safari15.4+支持，oklch()使用极坐标系表示彩度和色调。
- CSS颜色规范level4还支持#RRGGBBAA色值表示和更自由的rgb、hsl表示方法。
- CSS的数学函数也在不断增加，提升了CSS的能力，但转变需要时间和探索。
➡️
