Color Converter
Pick a color once, get it back in HEX, RGB, HSL, and CMYK at the same time. Copy whichever format you need.
Why so many formats?
HEX and RGB are the standard web formats, HSL is easier to reason about when you want to adjust lightness or saturation, and CMYK is what print workflows expect.
How it works
The hex value is split by a regex into three two-digit pairs and parsed base-16 into red, green, and blue from 0 to 255. HSL comes from the standard derivation: lightness is the average of the largest and smallest channel, saturation is the spread between them scaled by how close lightness is to the extremes, and hue depends on which channel dominates, with red, green, and blue anchored at 0, 120, and 240 degrees and the exact angle interpolated from the other two channels. CMYK uses the plain conversion formula: black (K) is one minus the strongest channel, then cyan, magenta, and yellow are whatever each channel is missing after black is accounted for, with pure black special-cased to avoid dividing by zero. All four outputs are rounded to whole numbers for readability, which is why converting back and forth can drift by a point.
About that CMYK value: treat it as a starting point, not print truth. Screen colors are defined in sRGB, and translating them to ink coverage properly requires an ICC color profile describing the specific press, inks, and paper. The formula here assumes idealized inks that don't exist, and plenty of vivid screen colors, saturated oranges, electric blues, bright greens, sit outside what coated paper can reproduce at all. Any print shop will re-convert your file through their own profile anyway, so use this tool's CMYK to communicate intent, and expect the proof to look duller than your monitor.
All the math above runs in a few small functions inside this page; picking a color triggers pure local arithmetic and four DOM updates. Nothing is fetched and nothing is sent, which the DevTools Network tab will confirm while you click around the picker.
Common questions
Why is CMYK only approximate?
CMYK is a print color space and its exact appearance depends on the specific ink and paper. The values here are a standard RGB-to-CMYK conversion, a solid starting point but not a substitute for your printer's color profile.
What's HSL useful for?
Hue, saturation, lightness. It's often easier to build a color palette by keeping hue fixed and varying lightness/saturation than by guessing RGB or hex values directly.
Does this store the colors I pick?
No. Everything happens locally in your browser and nothing is saved or sent anywhere.