颜色格式参考

包括HEX、RGB、HSL、CMYK和OKLCH在内的11种颜色格式的定义、值范围和用法。

HEX

以#为前缀的6位十六进制颜色代码。每对数字以16进制(00-FF)表示红、绿、蓝通道。

When to use
网页设计和CSS中最常见的格式。用于HTML、CSS、设计工具和版本控制。
Value ranges
#000000(黑色)到#FFFFFF(白色)。支持3位简写(#RGB)和8位透明度(#RRGGBBAA)。
CSS support
所有CSS版本均支持。
Try in Color Converter →

RGB

使用红、绿、蓝通道表示颜色,每个通道范围为0到255。基于加法混色——屏幕发光的方式。

When to use
数字显示器、图像编辑和编程颜色操作的标准。
Value ranges
R: 0-255, G: 0-255, B: 0-255
CSS support
所有CSS版本均支持rgb()和rgba()。
Try in Color Converter →

HSL

通过色相(色轮上的角度)、饱和度(强度)和亮度(明亮程度)定义颜色。比RGB更适合手动选色。

When to use
生成颜色变体的理想选择——调整亮度获得明暗变化,调整饱和度获得强度变化。
Value ranges
H: 0-360°, S: 0-100%, L: 0-100%
CSS support
CSS3+支持hsl()和hsla()。
Try in Color Converter →

CMYK

青色、品红、黄色、键色(黑色)。一种减色模型,用于印刷生产,墨水吸收光而非发射光。

When to use
印刷设计和印前工作流程必需。CSS中不直接支持。
Value ranges
C: 0-100%, M: 0-100%, Y: 0-100%, K: 0-100%
CSS support
CSS不支持。
Try in Color Converter →

HSB / HSV

色相、饱和度、明度(也称HSV——色相、饱和度、值)。类似于HSL,但使用明度而非亮度,与许多取色器的工作方式一致。

When to use
在Adobe Photoshop和Figma等设计工具的取色器中常见。
Value ranges
H: 0-360°, S: 0-100%, B: 0-100%
CSS support
CSS中不直接支持。
Try in Color Converter →

CIELAB (LAB)

一种感知均匀的颜色空间,等量的数值变化对应大致等量的感知颜色差异。由亮度(L)、绿-红轴(a)和蓝-黄轴(b)组成。

When to use
用于精确的色差计算(Delta-E)、颜色校正和设备无关的颜色表示。
Value ranges
L: 0-100, a: -128至127, b: -128至127
CSS support
CSS Color Level 4支持lab()。
Try in Color Converter →

CIE XYZ

由国际照明委员会定义的设备无关颜色空间。作为大多数其他颜色空间的数学基础。

When to use
用作颜色空间转换的中间步骤和色度计算。
Value ranges
X: 0-95.047, Y: 0-100, Z: 0-108.883(D65光源)
CSS support
CSS中不直接支持。
Try in Color Converter →

LCH

CIELAB的圆柱形式,使用亮度、色度(颜色强度)和色相(角度)。比LAB的a/b轴更直观,同时保持感知均匀性。

When to use
当需要独立调整色度或色相同时保持感知均匀性时,优于LAB。
Value ranges
L: 0-100, C: 0-150+, H: 0-360°
CSS support
CSS Color Level 4支持lch()。
Try in Color Converter →

OKLCH

一种现代感知颜色空间,通过更好的色相均匀性改进了LCH。由Björn Ottosson设计,用于修复CIELAB空间中出现的色相偏移。

When to use
推荐用于CSS Color Level 4的采用。在所有广泛支持的颜色空间中提供最均匀的亮度、色度和色相操作。
Value ranges
L: 0-1, C: 0-0.4+, H: 0-360°
CSS support
CSS Color Level 4支持oklch()。浏览器支持正在扩大。
Try in Color Converter →

HWB

色相、白度、黑度。通过色相角描述颜色,然后描述混入了多少白色和黑色。被认为是对人类最直观的颜色模型。

When to use
非技术用户易于理解。添加白度创建柔和色调,添加黑度创建更深的色调。
Value ranges
H: 0-360°, W: 0-100%, B: 0-100%
CSS support
CSS Color Level 4支持hwb()。
Try in Color Converter →

CIELUV (LUV)

一种针对加法混色(光)优化的感知均匀颜色空间。类似于CIELAB,但更适合涉及照明的应用。

When to use
用于照明设计、电视色彩科学和涉及发射光而非反射光的应用。
Value ranges
L: 0-100, u: -134至224, v: -140至122
CSS support
CSS不支持。
Try in Color Converter →