颜色转换工具
#409EFF
点击色块复制 HEX
HEX 输入
RGB 通道
HSL 色彩模型
HEX
#409EFF
RGB
rgb(64, 158, 255)
HSL
hsl(210, 100%, 63%)
HSB
hsb(210, 75%, 100%)
CSS 表示
background: #409EFF;border-color: #409EFF;颜色格式转换工具：HEX、RGB、RGBA、HSL 互转，实时预览色块，前端写样式、设计标注对色的日常工具。
适用场景
- 设计稿标注是 HSL、代码要 HEX：粘过来就转
- 给颜色调透明度：RGBA/HSLA 的 alpha 通道直接改
- 看懂 CSS 变量里的各种颜色写法
常见问题
HEX 和 RGB 是同一回事吗？
本质相同：#FF5733 就是 rgb(255, 87, 51) 的十六进制写法，每两位对应一个通道。8 位 HEX 的后两位是透明度（等价于 RGBA 的 alpha）。
什么时候用 HSL 更方便？
需要"调亮一点""换个色相"这类按人眼感知的调整时。HSL 的三个分量分别控制色相、饱和度、明度，比在 RGB 里盲调三个数字直观得多。