全能色彩换算 (HEX/RGB/HSL/CMYK/Tailwind)

在 HEX、RGB、HSL、HSV、印刷 CMYK 与 CSS 变量之间实时双向换算。支持取色器互动、色阶渐变生成与互补调色板。

输入任意颜色代码 (HEX / RGB / HSL / CMYK / 英文名):

HEX

#C85A32

RGB

rgb(200, 90, 50)

HSL

hsl(16, 60%, 49%)

HSV / HSB

hsv(16, 75%, 78%)

印刷 CMYK

cmyk(0%, 55%, 75%, 22%)

Tailwind / CSS

bg-[#c85a32]

明暗色阶与阴影渐变 (Tints & Shades):

浅亮色 (90% Tint) 当前基准色暗黑色 (90% Shade)

色彩搭配推荐 (互补色与邻近色):

嵌入此工具到你的网站 / 博客无需开发 · 复制即可使用

<iframe src="https://lucentool.com/zh/color-converter" width="100%" height="650" style="border:1px solid #e5e0d8;border-radius:12px;max-width:850px;width:100%;" frameborder="0"></iframe>
<div style="font-size:12px;color:#78716c;margin-top:6px;font-family:sans-serif;">Powered by <a href="https://lucentool.com/zh/color-converter" target="_blank" style="color:#c85a32;text-decoration:none;">Lucentool - 全能色彩换算与调色板工具</a></div>

HTML 嵌入代码 (iframe):

<iframe src="https://lucentool.com/zh/color-converter" width="100%" height="650" style="border:1px solid #e5e0d8;border-radius:12px;max-width:850px;width:100%;" frameborder="0"></iframe>
<div style="font-size:12px;color:#78716c;margin-top:6px;font-family:sans-serif;">Powered by <a href="https://lucentool.com/zh/color-converter" target="_blank" style="color:#c85a32;text-decoration:none;">Lucentool - 全能色彩换算与调色板工具</a></div>

常见色彩格式原理与使用场景

在 UI 设计、网页前端开发与传统印刷制版中，不同媒介使用的是截然不同的色彩空间规范：

HEX 与 RGB (屏幕发光加色模型)：由红 (R)、绿 (G)、蓝 (B) 三原色组成，每通道取值 0~255。HEX 是 RGB 的十六进制简写，网页 CSS 中最常用的颜色定义方式。
HSL (符合人类直觉的色相环)：由色相 (Hue 0°~360°)、饱和度 (Saturation 0%~100%) 与亮度 (Lightness 0%~100%) 构成，制作悬浮高亮色或暗黑模式调色极度方便。
CMYK (印刷油墨减色模型)：由青 (Cyan)、品红 (Magenta)、黄 (Yellow)、黑 (Key) 组成。印刷品通过吸收环境反射光线显色，印刷前必须将 RGB 换算为 CMYK。

全能色彩换算 (HEX/RGB/HSL/CMYK/Tailwind)

常见色彩格式原理与使用场景

相关推荐与高频工具