HSL/HSV 转换
在 HEX、RGB、HSL、HSV 间转换,可应用 HSL/HSV 更新 RGB。
颜色输入
调整 HSL
调整 HSV
💡 使用说明
什么是 HSL/HSV?
HSL 和 HSV 是两种基于色相的颜色表示模型,比 RGB 更符合人类对颜色的感知方式。
HSL 模型
HSL(色相、饱和度、明度)通过三个参数描述颜色:色相(0-360°)表示颜色种类,饱和度(0-100%)表示颜色纯度,明度(0-100%)表示颜色亮度。
HSV 模型
HSV(色相、饱和度、明度)与 HSL 类似,但明度参数不同。V(Value)表示颜色的最大亮度值。
功能特点
- 支持 HEX、RGB、HSL、HSV 互转
- 可视化滑块调节
- 实时颜色预览
- 独立调整 HSL/HSV 参数
- 一键复制各种格式
应用场景
- 设计系统颜色调整
- 颜色明度和饱和度微调
- 颜色空间转换
- 色相保持的颜色变体
使用技巧
- 调整色相可快速切换颜色种类
- 降低饱和度可得到灰度颜色
- HSL 的明度 50% 是最鲜艳的颜色
- HSV 更适合选择器实现
颜色预览
#3B82F6
格式值
HEX
#3B82F6RGB
rgb(59, 130, 246)59, 130, 246HSL
hsl(217, 91%, 60%)217, 91%, 60%HSV
hsv(217, 76%, 96%)217, 76%, 96%HSL vs HSV
HSL 明度 (L)
HSV 明度 (V)