颜色转换器

在HEX、RGB、HSL、CMYK等不同格式之间转换颜色。支持颜色选择、调色板生成和配色方案分析。

颜色选择器

使用颜色选择器选择颜色

颜色格式

当前颜色的各种表示格式

#
rgb(,,)
hsl(,%,%)
hsv(,%,%)
cmyk(%,%,%,%)
oklch(%%)

颜色格式说明

了解不同颜色格式的特点和适用场景

HEX 十六进制

使用 6 位十六进制数字表示颜色,如 #FF5733。这是网页开发中最常用的颜色格式,兼容性最好,适合在 CSS 和 HTML 中使用。

格式:#RRGGBB
范围:00-FF (0-255)
优点:简洁、兼容性好
缺点:不够直观

RGB 红绿蓝

使用红、绿、蓝三个颜色通道的数值来表示颜色,如 rgb(255, 87, 51)。这种格式直观易懂,适合设计师和开发者理解颜色构成。

格式:rgb(R, G, B)
范围:0-255
优点:直观、易理解
缺点:不直观表示亮度

HSL 色相饱和度亮度

使用色相、饱和度、亮度三个属性来表示颜色,如 hsl(12, 100%, 60%)。这种格式更接近人类感知颜色的方式,便于调整颜色的明暗和鲜艳程度。

格式:hsl(H, S%, L%)
范围:H: 0-360°, S/L: 0-100%
优点:直观、易调整
缺点:不直观表示亮度

HSV 色相饱和度明度

使用色相、饱和度、明度三个属性来表示颜色,如 hsv(12, 100%, 100%)。这种格式在图形软件中常用,明度值更直观地表示颜色的亮度。

格式:hsv(H, S%, V%)
范围:H: 0-360°, S/V: 0-100%
优点:明度直观、易调整
缺点:在网页中支持较少

CMYK 青品黄黑

使用青色、品红色、黄色、黑色四个颜色通道来表示颜色,如 cmyk(0%, 66%, 80%, 0%)。这是印刷行业的标准格式,适合需要打印的设计作品。

格式:cmyk(C%, M%, Y%, K%)
范围:0-100%
优点:印刷标准、专业
缺点:网页显示不准确

OKLCH 感知色彩空间

使用感知亮度、色度、色相三个属性来表示颜色,如 oklch(60% 50% 12)。这是现代色彩空间,更符合人眼感知,支持更广的色域,适合现代显示设备。

格式:oklch(L% C% H)
范围:L: 0-100%, C: 0-150, H: 0-360°
优点:感知准确、色域广
缺点:兼容性有限

使用建议

  • 网页开发:优先使用 HEX 和 RGB 格式,兼容性最好
  • 设计调整:使用 HSL 格式,便于调整色相和饱和度
  • 专业印刷:使用 CMYK 格式,确保打印效果
  • 现代应用:考虑使用 OKLCH 格式,获得更好的色彩表现
  • 颜色选择:使用 HSV 滑块,直观地选择颜色