颜色值转换器
输入 HEX、RGB 或 HSL 任一种颜色值，实时在三者间互相转换并预览色块，方便前端与设计师在代码中精确选取与核对颜色，避免色差。
🎨 Color Value Converter (HEX / RGB / HSL)
📐 工作原理与说明
在 RGB、HEX、HSL、HSV 等颜色表示之间转换。
- RGB/HEX：三通道各 0–255，HEX 为
#RRGGBB，#RGB简写会等比扩展。 - HSL：色相 H（0–360°）、饱和度 S（0–100%）、亮度 L（0–100%），更贴近直觉调色。
- HSV：V 为明度，与 HSL 的 L 不同——L=100% 是纯白，V=100% 是纯色。
- 转换：先归一化到 [0,1] 再按分段公式互转；屏幕色域不同会导致显示差异。
Convert colors between HEX, RGB and HSL with live preview.
📌 格式说明
- HEX：#RRGGBB，如 #FF6B35。
- RGB：rgb(255, 107, 53) 或 rgba(255,107,53,1)。
- HSL：hsl(17, 100%, 60%) 或 hsla(17,100%,60%,1)。
📚 深度解析：颜色值转换器
💡 常见使用场景
- HEX、RGB、HSL 互转用于前端配色。
- 从设计稿取色：把设计工具给出的 HSL 值转成 HEX 写进 CSS，或反过来把线上色值转成 HSL，以便系统性调整饱和度与亮度。
转换
#FF0000 ↔ rgb(255,0,0) ↔ hsl(0,100%,50%)（纯红）。
❓ 常见问题（FAQ）
- HSL 的 L=50% 含义？
- 恰好为该色相的中间亮度，L=100% 为白、0% 为黑。
- HEX 和 RGB 显示的颜色会不一样吗？
- 数值一致则颜色一致，两者只是表示方式不同。真正影响显示的是色彩空间与设备：#FF0000 在 sRGB 与 Display P3 屏上观感不同，广色域屏会更鲜艳。关键设计建议标注色彩空间，并在目标设备上实测。