frontend-syntax-css-color-modern

用途：作为 2026 年原生 CSS 颜色函数的操作参考，帮助在系统性配色、混色、明暗模式与宽色域场景中做出一致决策。主要能力：oklch(L C H) 用于感知均匀的配色与明度调整；相对颜色语法 oklch(from <seed> l c h) 从种子色派生相关色；color-mix() 在指定色彩空间混合两色，支持极性色彩空间的色相插值；light-dark() 按 color-scheme 解析浅色或深色值；color(display-p3/rec2020 ...) 提供宽色域颜色，并以 color-gamut 媒体查询做门槛。使用要点：系统性配色、阶梯与悬停态优先用 oklch()，避免用 hsl()；混色默认用 oklab 或 oklch，避免在 sRGB 中做设计系统混色；使用 light-dark() 前必须在 :root 或相关祖先声明 color-scheme: light dark，否则会静默回退到浅色值；宽色域颜色始终提供 sRGB 回退，百分比、色相插值参数按需设置。适用场景：品牌色派生明暗调和色阶、确定性混色、组件作用域明暗主题、需 P3 的鲜艳色。限制：不涵盖 Sass 颜色函数、设计令牌方法论、调色板生成和 WCAG 对比度计算；light-dark() 在旧浏览器需回退到 prefers-color-scheme 媒体查询。