HEX 转 OKLCH 转换器

OKLCH 用感知明度（L）、色度（C，颜色有多鲜艳）和色相角（H）来描述颜色。与 HSL 不同，L 变化相同的量，在所有色相上看起来明暗变化也相同，因此它是制作调色板、悬停状态和符合无障碍对比度要求的最佳色彩空间。这个转换器可以把 HEX、rgb() 或 hsl() 转换成 CSS 用的 oklch() 和 oklab()，也能把 OKLCH 转回 HEX——对落在 sRGB 之外的颜色，用 CSS Color 4 的方法映射回色域内，并告诉您它是否落在 sRGB 和 Display P3 色域内。

使用方法

1. 选择转换方向。
2. 输入 HEX、rgb() 或 hsl() 颜色，或 oklch(70% 0.2 150) 这样的 oklch() 值。
3. 查看 L、C、H、oklab() 形式，或带色域检查的 HEX。
4. 颜色较多时，把列表粘贴到批量框中。

计算公式

线性 sRGB → LMS (3×3) → ∛ → OKLab (3×3) · C = √(a² + b²) · H = atan2(b, a)

矩阵采用 Ottosson 的矩阵，与 CSS Color 4 一致。超出色域的颜色在保持明度 L 和色相 H 不变的前提下降低色度，直到简单截断造成的色差小于 ΔEOK 0.02，这就是 CSS Color 4 的算法。

示例

纯红色 #FF0000 是 oklch(62.8% 0.2577 29.23) 和 oklab(62.8% 0.2249 0.1258)，也是 CSS Color 4 规范中的数值。反过来，oklch(70% 0.4 150) 是一种连 Display P3 都放不下的鲜绿色：色域映射得到 #00C248，而直接截断通道得到更亮更刺眼的 #00D600。oklch(70% 0.2 150) 在 P3 内但不在 sRGB 内；其截断值 #00BF54 已在容差范围内。