这个工具是做什么的
设计稿给的是 #4F46E5，代码里却要写成 rgb(79, 70, 229)；想调整一个颜色的深浅又不会算——颜色转换工具可以帮你在 HEX、RGB、HSL 之间自由互转。
除了互转，工具还提供取色功能，你可以直接在调色板上选取颜色并复制对应代码。
核心能力
- HEX、RGB、HSL 三种格式任意互转
- 可视化取色板，拖动即可选色
- 实时预览颜色效果
- 一键复制对应格式的颜色代码
选项一览
| 参数 | 默认值与范围 | 使用建议 |
|---|---|---|
| 格式 | HEX / RGB / HSL | 三种格式实时互转，改任一项其余同步更新 |
| 取色 | 内置颜色选择器 | 也可以直接输入十六进制值 |
典型用法
- 把设计稿的 HEX 色值转成代码需要的 RGB
- 按 HSL 调整颜色的明度与饱和度
- 为新页面挑选并确认配色
HSL 为什么更适合调色
HEX 和 RGB 描述的是「混了多少红绿蓝」，想调出「同一个色系的浅色」得反复试；HSL 把色相（H）、饱和度（S）、亮度（L）拆开，想变浅只调 L，想变灰只调 S，一步到位。
做设计系统时，通常固定 H 和 S，用 L 生成 5–7 档色阶，这样整组颜色天然协调。
你可能想问
HEX、RGB、HSL 有什么区别？
HEX 是十六进制写法，最短也最常用；RGB 按红绿蓝三通道数值表示；HSL 按色相、饱和度、亮度表示，调整明暗更直观。
支持带透明度的颜色吗？
可以。HEX 支持八位写法，RGB 可使用 rgba 形式。透明度在转换时会被保留。
转换会有色差吗？
不会。三种格式只是同一颜色的不同表示方式，数值之间可以精确换算。
顺手看看
本地处理说明
颜色格式转换 在你的浏览器本地完成全部计算，你选择的文件与输入的内容都不会被上传到任何服务器，处理结束后即被释放。详细的数据处理方式请查看我们的隐私政策。