Color Converter – HEX, RGB, HSL, CMYK & CIE Coordinates | Free

Display Calculator

Color Converter

Convert HEX, RGB, HSL color codes in real-time and generate Tailwind CSS scales.

#3B82F6
Recent Colors
#
HEX
R
RGB
R
G
B
H
HSL
H
S%
L%
T
Tailwind CSS Scale
Display Calculator

Color Coordinates

View CIE 1931, CIE 1976 chromaticity and various color space values. Input values directly to convert.

CIE XYZ Tristimulus Values
X
Y
Z
CIE 1931 Chromaticity (xyY)
x
y
Y
CIE 1976 Uniform Chromaticity (u’v’)
u’
v’
CIELAB L*a*b*
L*
a*
b*
HSV Hue / Saturation / Value
H
S%
V%
CMYK Print Colors
C%
M%
Y%
K%
Display Calculator

Color Picker

Select a color by clicking on the gradient area or adjusting the hue slider.

Display Calculator

Palette Generator

Generate harmonious color combinations based on the selected color.

Display Calculator

Conversion Formulas

Color space conversion formulas used in this tool. All calculations are based on D65 Standard Illuminant and CIE 1931 2° Standard Observer.

☀D65 White Point
D65 simulates average noon daylight (~6500K). Tristimulus values for 2° observer:
Xn = 0.95047
Yn = 1.00000
Zn = 1.08883
Chromaticity: x = 0.31272, y = 0.32903
1sRGB → Linear RGB
Convert sRGB (0-255) to linear RGB by removing gamma correction (γ ≈ 2.2).
C’ = C / 255
If C’ ≤ 0.04045:
Clinear = C’ / 12.92
If C’ > 0.04045:
Clinear = ((C’ + 0.055) / 1.055)2.4
Apply to each R, G, B channel
2Linear RGB → CIE XYZ
Convert linear RGB to XYZ tristimulus using sRGB color space matrix (D65).
X=0.41245640.35757610.1804375R
Y0.21267290.71515220.0721750G
Z0.01933390.11919200.9503041B
Y represents relative luminance
3XYZ → CIE 1931 xyY
Convert XYZ to chromaticity coordinates (x, y) and luminance (Y).
x = X / (X + Y + Z)
y = Y / (X + Y + Z)
Y = Y (luminance)
z = 1 – x – y (can be calculated)
4XYZ → CIE 1976 u’v’
Convert XYZ to Uniform Chromaticity Scale (UCS).
u’ = 4X / (X + 15Y + 3Z)
v’ = 9Y / (X + 15Y + 3Z)
Used for CIELUV color space chromaticity
5XYZ → CIELAB (L*a*b*)
Convert XYZ to perceptually uniform CIELAB.
L* = 116 × f(Y/Yn) – 16
a* = 500 × [f(X/Xn) – f(Y/Yn)]
b* = 200 × [f(Y/Yn) – f(Z/Zn)]
If t > 0.008856: f(t) = t1/3
If t ≤ 0.008856: f(t) = 7.787t + 16/116
L*: lightness (0-100), a*: green-red, b*: blue-yellow
6RGB → HSL
Convert RGB to Hue, Saturation, Lightness.
M = max(R,G,B), m = min(R,G,B)
L = (M + m) / 2
If M = m: S = 0
If L ≤ 0.5: S = (M-m)/(M+m)
If L > 0.5: S = (M-m)/(2-M-m)
RGB normalized to 0-1 range
7RGB → CMYK
Convert RGB to CMYK for print.
K = 1 – max(R, G, B)
If K = 1: C = M = Y = 0
If K < 1:
C = (1 – R – K) / (1 – K)
M = (1 – G – K) / (1 – K)
Y = (1 – B – K) / (1 – K)
ICC profile-based conversion recommended for printing
References
  • CIE 15:2004 – Colorimetry, 3rd Edition
  • IEC 61966-2-1:1999 – sRGB Color Space
  • Bruce Lindbloom’s Color Space Conversions
Display Calculator

Understanding Color Models

Learn about different color models, their origins, and when to use each one.

RGB
Additive Color Model

RGB is an additive color model where red, green, and blue light are combined to create colors. It’s the native format for digital displays.

Each channel ranges from 0-255, creating over 16 million possible colors. RGB is device-dependent, meaning the same values can appear differently on different screens.

ChannelsR, G, B (0-255)
Total Colors16,777,216
Use CaseDigital displays
HSL / HSV
Cylindrical Color Models

HSL (Hue, Saturation, Lightness) and HSV (Hue, Saturation, Value) represent colors in a way that’s more intuitive for humans to understand and manipulate.

Hue is the color angle (0-360°), saturation is color intensity, and lightness/value controls brightness. These models are ideal for color selection interfaces and CSS.

Hue0° – 360°
Saturation0% – 100%
Use CaseColor pickers, CSS
CIE XYZ
Device-Independent Standard

CIE XYZ, established in 1931, is the foundation of colorimetry. It’s based on human vision and serves as the master reference for all color space conversions.

Y represents luminance, while X and Z encode chromaticity. XYZ is device-independent, making it essential for accurate color management across different devices.

StandardCIE 1931
Observer2° field
Use CaseColor science, ICC
CIELAB
Perceptually Uniform

CIELAB (L*a*b*) was designed to be perceptually uniform, meaning equal numerical differences correspond to equal perceived color differences.

L* is lightness (0-100), a* goes from green to red, and b* from blue to yellow. CIELAB is used for color difference calculations (Delta E) and professional color matching.

L* Range0 – 100
a*, b* Range±128 typical
Use CaseDelta E, printing
CMYK
Subtractive Print Model

CMYK uses cyan, magenta, yellow, and black inks in a subtractive color model. Unlike RGB which adds light, CMYK subtracts light from white paper.

The K (Key/Black) channel improves text quality and reduces ink usage. CMYK gamut is smaller than RGB, so some screen colors cannot be printed accurately.

ChannelsC, M, Y, K (0-100%)
GamutSmaller than RGB
Use CasePrint production
CIE 1976 u’v’
Uniform Chromaticity

The CIE 1976 UCS (Uniform Chromaticity Scale) diagram addresses the non-uniformity of the 1931 xy diagram by providing more perceptually even spacing.

It’s preferred for calculating color differences and gamut coverage, as equal distances better represent equal perceived color differences.

StandardCIE 1976
Coordinatesu’, v’
Use CaseGamut analysis
View All Display Calculators
Copied!