什么是颜色转换器?
颜色转换器将一个颜色值转换为在网页设计、CSS、设计系统和交接说明中常用的格式。单个品牌色在样式指南中可能以 HEX 存储,在设计令牌中以 RGB 表示,在主题编辑器中以 HSL 表示,而在面向印刷的说明中为 CMYK。本工具将这些表示汇集在一起,方便复制正确的版本,而无需手动重新计算。
本转换器设计为紧凑,专注于实用的 sRGB 网页颜色:HEX、RGB、HSL、HSV 以及简单的 CMYK 近似值。它并不试图替代专业的颜色管理软件或 ICC 配置文件工作流。
支持的颜色格式
| Format | Example | 最佳用途 |
|---|---|---|
| HEX | #3366FF | CSS、设计令牌、快速视觉交接 |
| RGB | rgb(51, 102, 255) | CSS 值、画布操作、程序化色彩通道 |
| HSL | hsl(225, 100%, 60%) | 通过色相、饱和度和明度进行主题调整 |
| HSV | hsv(225, 80%, 100%) | 拾色器式的工作流程和视觉调优 |
| CMYK | cmyk(80%, 60%, 0%, 0%) | 用于近似的印刷备注,而非最终印刷的色彩管理 |
重要限制
- CMYK 输出是根据 sRGB 值计算的,仅为近似值。
- CSS 命名颜色、渐变、Lab、LCH、OKLCH 和 Display-P3 超出此紧凑版 v1 的范围。
- 可解析常见的带 alpha 的 HEX/RGB/HSL 形式,但原生色板预览显示不透明的基础颜色。
- 不同的设计工具可能对 HSL、HSV 或 CMYK 值进行略微不同的四舍五入。
常见工作流程
CSS 清理
从样式指南粘贴 HEX 颜色,并复制对应的 RGB 或 HSL,用于组件状态、图表调色板或主题变量。
设计交接
当开发者、设计师或内容编辑使用不同工具时,保留多种颜色表示以便一起使用。
令牌审查
在将颜色令牌用于公共界面之前,检查其是否映射到预期的色相和饱和度。
印刷备注
生成用于讨论的近似 CMYK 值,最终印刷输出应由支持配置文件的工具完成。
常见问题
CMYK 输出是精确的吗?
不。CMYK 值是从 sRGB 简单转换得到的,适用于粗略记录。最终印刷工作取决于纸张、油墨、印刷机设置和 ICC 配置文件。
我可以粘贴 CSS 颜色函数吗?
支持常见的 RGB、HSL、HSV 和 CMYK 风格函数语法。较新的色彩空间(如 Lab、LCH、OKLCH 和 Display-P3)故意不在该紧凑工具的适用范围内。
该工具支持 alpha 透明度吗?
它可以解析常见的带 alpha 形式,如 RGBA、HSLA 和八位 HEX,但主色板和复制输出侧重于实用的不透明网页颜色。
为什么数值有时与其他设计工具不同?
小差异通常来自四舍五入规则或颜色管理假设。对于网页 sRGB 颜色,这些差异通常很小。
什么时候应改用对比度检查器?
当需要比较两种颜色的文本可读性时,请使用对比度检查器。本转换器仅在不同格式之间转换单个颜色。