LCH 转 HSLA 转换器

粘贴 LCH 值，立即得到 HSLA。其他格式也同样支持。

从 LCH

识别为 CIE LCH

HSLA 值hsla(10.59, 99.99%, 60%, 1)

调整颜色

色相11°

不透明度100%

亮度68%

彩度0.210

色相34°

在 8 位 HEX 中，最后两位表示不透明度：FF 完全不透明，80 约为 50%，00 完全透明。表格按 5% 的间隔列出示例颜色。

不透明度	HEX 透明度	HEX	HSLA
100%	ff	#ff5733	hsla(10.59, 100%, 60%, 1)
95%	f2	#ff5733f2	hsla(10.59, 100%, 60%, 0.95)
90%	e6	#ff5733e6	hsla(10.59, 100%, 60%, 0.9)
85%	d9	#ff5733d9	hsla(10.59, 100%, 60%, 0.85)
80%	cc	#ff5733cc	hsla(10.59, 100%, 60%, 0.8)
75%	bf	#ff5733bf	hsla(10.59, 100%, 60%, 0.75)
70%	b3	#ff5733b3	hsla(10.59, 100%, 60%, 0.7)
65%	a6	#ff5733a6	hsla(10.59, 100%, 60%, 0.65)
60%	99	#ff573399	hsla(10.59, 100%, 60%, 0.6)
55%	8c	#ff57338c	hsla(10.59, 100%, 60%, 0.55)
50%	80	#ff573380	hsla(10.59, 100%, 60%, 0.5)
45%	73	#ff573373	hsla(10.59, 100%, 60%, 0.45)
40%	66	#ff573366	hsla(10.59, 100%, 60%, 0.4)
35%	59	#ff573359	hsla(10.59, 100%, 60%, 0.35)
30%	4d	#ff57334d	hsla(10.59, 100%, 60%, 0.3)
25%	40	#ff573340	hsla(10.59, 100%, 60%, 0.25)
20%	33	#ff573333	hsla(10.59, 100%, 60%, 0.2)
15%	26	#ff573326	hsla(10.59, 100%, 60%, 0.15)
10%	1a	#ff57331a	hsla(10.59, 100%, 60%, 0.1)
5%	0d	#ff57330d	hsla(10.59, 100%, 60%, 0.05)
0%	00	#ff573300	hsla(10.59, 100%, 60%, 0)

CIE LCH 是 Lab 的极坐标形式：亮度、彩度和色相。它比 Lab 更容易理解，CSS 中写作 lch()。

HSLA 是在 HSL 上加了表示不透明度的 Alpha 通道，写作 hsla(11, 100%, 60%, 0.5)。Alpha 从 0（完全透明）到 1（完全不透明），现代 CSS 也可以直接写在 hsl() 里。

我们读取 LCH 值，用 CSS Color 4 规范中的矩阵将其转换为 CIE XYZ，再转换为 HSLA。超出目标色域的值会按 CSS Color 4 算法映射：保持亮度和色相，降低彩度。

如何将 LCH 转换为 HSLA？

在上方输入框中粘贴或输入 LCH 值。PickShade 会在你输入时用 CSS Color 4 公式实时转换，点击一下即可复制 HSLA 值。

LCH 转 HSLA 的结果精确吗？

计算是精确的，结果只在显示时取整，保留的位数足以转换回同一个颜色。如果颜色超出目标色域，PickShade 会提示你，并显示色域内最接近的颜色。

能同时得到其他格式吗？

可以。其他所有格式，包括 OKLCH、Display P3、Tailwind、SwiftUI、Flutter 和 Android，都列在结果下方，点击即可复制。

这个转换器免费吗？

免费。无需注册，完全在你的浏览器中运行。