跳到主内容

颜色格式转换

在浏览器本地将单个颜色在 6 位 HEX(#RRGGBB)、RGB、HSL、CMYK 之间互转,支持取色器、随机颜色、实时预览与通道微调;HEX/RGB/HSL 输出为可复制的 CSS 值,CMYK 输出为参考记法。

HEX

#

RGB

HSL

CMYK

颜色格式转换

快速开始

1
输入 6 位 HEX 或 RGB/HSL/CMYK 通道
2
使用取色器或随机色,再查看同步值

常见使用场景

设计联动

将设计稿中的 HEX 转换为 CSS RGB/HSL 用于开发

风格指南

统一组件库的颜色格式与书写风格

印刷参考

将屏幕色转换为 CMYK 作为印刷初步估算,最终需结合打样与印刷流程确认

可访问性

预览仅适合做颜色视觉初查,精确比例请使用专门的对比度工具

转换参数与显示

输入规则:HEX 仅支持 6 位(#RRGGBB,不支持 #RGB、#RGBA、#RRGGBBAA 或 Alpha);RGB 为 0–255;H 为 0–360,S/L 为 0–100;CMYK 为 0–100。输入不区分大小写
预览行为:桌面端右侧实时预览;移动端为轻量模式,不显示预览
取色器:使用 HEX 卡片中的颜色选择器。
HEX 大写策略:输出统一为大写(如 #1E90FF),输入不区分大小写;无大小写切换开关
微调:按住通道字母左右拖动可微调(Shift×10,Alt÷0.1)
复制输出:复制按钮会输出标准化的 HEX、RGB、HSL CSS 值(HEX 统一大写),或 CMYK 参考记法 cmyk(...)

使用建议

精度意识:sRGB 与显示设备存在差异,不同软件取色结果可能略有偏差
透明度:当前格式不含 Alpha;需要透明度时请使用 rgba()/hsla() 或单独维护
色彩空间:Web 默认 sRGB;在 P3/Display‑P3 等广色域场景下需谨慎验证
团队一致:约定统一的颜色格式(如 CSS 中统一使用 HSL)

限制与兼容性

设备差异:不同显示器/浏览器/系统的色彩管理不同,实际观感可能差异
CMYK 近似:CMYK 值受 ICC 配置、纸张、油墨、设备与打样流程影响;本页仅作参考,不是可直接交付印刷的最终值
不含 Alpha:本工具不处理透明通道、rgba()、hsla()、#RGBA 或 #RRGGBBAA 值
CSS 颜色子集:CSS named colors、transparent、currentColor、HWB、HSV/HSB、Lab、LCH、OKLab、OKLCH、Display-P3、device-cmyk()、relative colors、color-mix() 与 contrast-color() 不属于本工具范围
不做图片或色板工具:本页不支持图片取色、屏幕吸色、色板生成、渐变生成、对比度计算、CSS 变量导出或 design token 导出

隐私与安全

处理在浏览器中完成。当前颜色可能保留在当前浏览器会话中。若保存工作区或启用 WebDAV,当前颜色可能作为该工作区的一部分保存或同步。派生输出、撤销历史和临时错误不会作为单独数据存储或同步;本工具不保留最近颜色列表。本页不读取图片、不采样屏幕、不抓取 URL,也不会把颜色发送到服务端转换。在共享设备上,必要时清空颜色和站点数据。

常见问题

5

可继续使用这些相关工具,完成后续步骤。

所有工具处理都在您的浏览器本地完成。