在线免费颜色代码转换器
在HEX、RGB、HSL、HSV和CMYK之间转换颜色。
Who uses the 颜色代码转换器?
- 前端开发者把设计工具中的 HEX 色板转换为 RGB 或 HSL，用于 CSS 变量。
- 学习 HEX、RGB、HSL 如何以不同方式表示同一种颜色的学生。
- 核对从样式指南或截图中提取的颜色值的设计师。
How the 颜色代码转换器 works
选择与你的颜色格式匹配的标签页——HEX、RGB 或 HSL。
输入数值：HEX 代码（如 #FF5733），或数字形式的 R/G/B 或 H/S/L 字段。
输入时另外两种格式和色板会自动更新。
在色板下方的结果行中读取 HEX、RGB 和 HSL 数值。
Tips & tricks
- 根据输入格式切换标签页——每个标签页下的字段是相互独立的，而不是一个统一的万能输入框。
- 色板会实时更新，方便你在复制之前直观核对转换结果。
- 调整颜色时 HSL 通常更容易把握——提高 L 让颜色更亮，降低 S 减弱饱和度。
- 本工具没有透明度（Alpha）通道——如果 CSS 需要透明效果，请在转换后手动添加 alpha 值（例如 rgba(r, g, b, 0.5)）。
Frequently Asked Questions
这个工具支持哪些 CSS 颜色格式？
本工具可在 HEX（3位或6位）、RGB 和 HSL 之间转换——这是三种最常见的 CSS 颜色格式。目前不支持 RGBA/HSLA 透明度通道、HSB/HSV、CMYK，也不支持像“coral”这样的 CSS 命名颜色。
RGB 和 HSL 有什么区别？
RGB 通过红、绿、蓝三个分量（各 0–255）定义颜色。HSL 则通过色相（0-360°）、饱和度（0-100%）和明度（0-100%）定义颜色——在调整颜色时通常更直观，因为你可以直接调亮或降低饱和度，而无需重新计算 RGB。
如何把“coral”这样的命名颜色转换为 HEX？
本工具不会查询命名颜色——请直接输入它的 HEX 值（coral = #FF7F50）。你可以在 CSS Color Module 规范或任意浏览器的取色器中查到命名颜色对应的 HEX 值。
什么是 HSB/HSV，这个工具支持吗？
HSB（色相、饱和度、明度），也叫 HSV，常用于 Photoshop 和许多设计工具——它与 HSL 类似，但第三个通道的定义方式不同。本工具只转换 HEX/RGB/HSL；如果你的来源是 HSB，请先在设计工具中转换。
可以转换使用 CSS 自定义属性（变量）的颜色吗？
请输入实际的颜色值，而不是变量名。先把 --my-color 解析成它的实际值，再进行转换。本工具处理的是真实的颜色值，而不是 CSS 变量引用。
Is my data safe when using the 颜色代码转换器?
Completely safe. The 颜色代码转换器 processes everything locally in your browser. No input data, results, or usage information is ever transmitted to or stored on any server.
Can I use the 颜色代码转换器 output in commercial projects?
Yes. The 颜色代码转换器 is a utility tool and its output carries no licensing restrictions. You are free to use results in any project, commercial or personal.
Does the 颜色代码转换器 follow official standards?
Yes. The 颜色代码转换器 is built to comply with the relevant industry standard or specification for this utility type. If you encounter an unexpected result, verify your input against the specification — edge cases outside the standard may produce undefined behaviour.