什么是颜色转换器?

颜色转换器在 HEX、RGB、HSL、HSV 和 CMYK 格式之间互转。选个颜色或输入数值,即可在实时预览中查看所有格式的结果。

用色轮选色,或在 HEX、RGB、HSL、HSV、CMYK 任一栏里直接输入数字,其它栏会即时更新。这里同时给出 HSL 和 HSV(也叫 HSB)。后者在 Photoshop、Sketch 和系统取色器里更常见,普通 CSS 工具里看不到。

使用方法

  1. 第一步——使用交互式取色器选取颜色,或在任意格式字段中直接输入色值。
  2. 第二步——所有格式字段同时更新,让你随时看到每种格式的对应数值。
  3. 第三步——复制任意格式的数值,或用取色器微调。每个字段都会实时跟着变。

何时使用

  • 用色轮取色,然后复制 CMYK 值贴进 Illustrator 文档。
  • 调好 Photoshop 调色板里的 HSV 值,读出对应的 CSS HSL。
  • 从零开始组配色:拖动取色器,每次记下 HEX 值。

结果

一位印刷设计师需要将网页颜色 rgb(0, 128, 255) 转为 CMYK 值,工具将其转换为 cmyk(100%, 50%, 0%, 0%),确保印刷色彩准确还原。

常见问题

为什么同时给 HSL 和 HSV,看起来不是差不多?
HSL 配套 CSS 和大部分 Web 工具;HSV(又叫 HSB)是 Photoshop、Sketch 以及 macOS / Windows 原生取色器的默认。设计师常常在两类工具之间来回切,这里两个都给,省去再转一次的麻烦。
可以直接改字段,还是只能用色轮?
每个字段都能改。手输 HEX,或在 RGB / HSL / HSV / CMYK 里改任意数字,色轮和其它字段都会跟着同步。改哪一栏都不影响整体一致性。
为什么灰色的 HSL 显示色相和饱和度都是 0?
纯灰没有色相,饱和度为 0。HSL 在饱和度为 0 时,按惯例把色相也记成 0,因为灰色在色环上没有具体位置。这个值在数学上正确,只是容易被当成「数据缺失」。
CMYK 里的 K 是什么意思?
K 代表 Key,实际就是黑色。印刷上不靠 CMY 混合出近似黑,而是直接加 K,既省彩色油墨,又能避免 CMY 混出的偏棕浊色。工具会自动计算 K 值。
色轮在触屏或手写笔上能用吗?
可以。色轮就是浏览器原生的取色器输入,所以鼠标、触控板、手指、手写笔都能操作。手机触屏点一下会弹出系统的取色器,桌面点击会展开色轮。需要精确取值时还是输入框更方便。

相关工具