Color Space Converter
Seamlessly translate between HEX, RGB, HSL, HSV, and CMYK color spaces. Tune channels in real time with synchronized sliders and copy production CSS code.
RGB (Red, Green, Blue)
HSL (Hue, Sat, Light)
CMYK (Print Color)
Understanding Color Models: Screen vs. Print
Additive RGB vs. Subtractive CMYK
Digital monitors operate via the additive RGB model: red, green, and blue light emit from pixels and combine toward pure white light (#ffffff).
Conversely, physical four-color process printing relies on the subtractive CMYK model (Cyan, Magenta, Yellow, Key/Black). Inks absorb specific light wavelengths reflected off paper; combining all pigments produces darkness. Because RGB has a broader color gamut than standard CMYK inks, vibrant neon screen shades will appear slightly muted when printed.
Why UI Engineers Prefer HSL (Hue, Saturation, Lightness)
Modifying an RGB value to create hover states or color variations requires adjusting all three red, green, and blue numbers simultaneously.
With HSL, color generation becomes intuitive: keep Hue (0-360°) constant and adjust Lightness by +10% for hover states or -10% for active pressed states. This makes HSL the ideal color model for scalable design systems and dynamic theming.