颜色转换器 - HEX/RGB/HSL/CMYK 在线互转

HEX、RGB、HSL 与 CMYK 颜色转换器

这款颜色转换器能实时把一种格式的颜色转成另一种格式，让你在 HEX、RGB、HSL、HSV 和 CMYK 之间随意切换，无需自己动手计算。输入一个代码，结果会随着每次按键即时更新，点一下就能复制。

它专为需要匹配 CSS 颜色格式的网页开发者、在不同工具间搬运颜色的设计师，以及要把屏幕颜色转成可印刷 CMYK 的印刷从业者打造。如果你经常从设计稿里读取 HEX 代码、从 CSS 里取 RGB 值，这个工具能让每种格式都触手可及。

隐私优先：每一次转换都在你的浏览器中运行。你的颜色值不会被上传到服务器，也不会被保存到任何地方，而且页面加载完成后工具仍可继续使用。

如何转换颜色

选择转换方向

从选项卡中选择你需要的转换：HEX → RGB、RGB → HEX、HEX → HSL、HSL → HEX、RGB → HSL 或 RGB → CMYK。

输入颜色值

在输入框中填写颜色值。HEX 带不带 # 都可以，也支持 3 位简写；RGB 和 HSL 既接受用逗号分隔的数字，也接受完整的 rgb(...) / hsl(...) 写法。

也可以直观取色

点击大块的颜色预览即可打开取色器。任选一种颜色，输入框会自动按当前选项卡所需的格式填好，并立即完成转换。

复制结果

点击输出旁边的复制按钮，即可把转换后的值复制到剪贴板。展开所有格式，就能一次看到 HEX、RGB、HSL、HSV 和 CMYK，每一个都带有自己的复制按钮。

功能特点

即时转换

边输入边实时转换。结果随每次按键更新，无需点击任何按钮。

实时颜色预览

大块预览方块即时更新，并带有与所输入颜色相匹配的动态阴影。

可视取色器

不知道代码？点击预览打开取色器，输入框会自动填入正确的格式。

所有格式一次看全

展开所有格式，并排查看 HEX、RGB、HSL、HSV 和 CMYK，每个都带复制按钮。

一键复制

每个输出都有复制按钮。点一下即可把值复制到剪贴板，并弹出确认提示。

输入校验

无效的值会以清晰的提示标出，输入框保持红色高亮，直到格式正确为止。

灵活的输入格式

支持带或不带 # 的 HEX、3 位简写 HEX，以及裸数字或带 rgb() / hsl() 包裹的 RGB、HSL。

自适应布局

转换器在任何设备上都能用，小屏幕上会切换为纵向布局，操作更顺手。

常见问题

如何把 HEX 转成 RGB？

打开 HEX → RGB 选项卡，输入你的十六进制代码，例如 #3B82F6（# 可省略，像 #FFF 这样的 3 位简写也能用）。RGB 值会立即显示，复制按钮可把它放进剪贴板。

如何把 RGB 转成 HEX？

使用 RGB → HEX 选项卡，按 59, 130, 246 或 rgb(59, 130, 246) 的形式输入数值。对应的十六进制代码会随输入生成。RGB 和 HEX 描述的是同一种屏幕颜色，因此两个方向互转都不会丢失颜色。

RGB 和 CMYK 有什么区别？

RGB 是用于屏幕的加色模型，混合红、绿、蓝三种光。CMYK 是用于印刷的减色模型，使用青、品红、黄和黑（key）四种油墨。CMYK 的色域更小，因此屏幕上一些鲜艳的颜色无法在印刷中被完全准确地还原。

如何把颜色转成用于印刷的 CMYK？

打开 RGB → CMYK 选项卡，输入你的 RGB 值（或直观地选取一种颜色）。工具会返回可交给印刷工序的 CMYK 百分比。由于 CMYK 色域更小，请把结果当作一个相近的起点，关键颜色还要与印刷方确认。

什么是 HSL 颜色，何时该用它？

HSL 代表色相（Hue）、饱和度（Saturation）和亮度（Lightness），在调整颜色时比 RGB 更直观。想让颜色更亮、更暗或更鲜艳，只需改动其中一个值，而不必同时摆弄三个值，这对制作浅色、深色和主题配色很方便。用 HEX → HSL 或 RGB → HSL 选项卡即可得到 HSL 值。

可以把 CMYK 转回 RGB 吗？

本工具支持从 RGB 转到 CMYK，而不是反向转换。若要逆向操作，可用 RGB → HEX 选项卡找到你的 RGB 或 HEX 值，或在确实需要这个方向时，改用专门的 CMYK 转 RGB 工具。

我的数据会被保存或上传吗？

不会。每一次转换都直接在你的浏览器中完成。你的颜色值不会被发送到服务器，也不会被保存，而且页面加载完成后，即使离线工具也能继续使用。