Color converter
Paste any color, whether hex, rgb(), hsl(), or a CSS name, and get every format back at once. Switch to bulk mode to convert a whole list.
How this works
- 1 Paste or type a color in any format, or pick one with the swatch.
- 2 Every other format updates as you type: RGB, HSL, CMYK, Lab, OKLCH.
- 3 Click any code to copy it, or switch to bulk mode for a whole list.
- HEX
- #e08b3d
- RGB
- rgb(224, 139, 61)
- RGBA
- rgba(224, 139, 61, 1)
- HSL
- hsl(29, 72%, 56%)
- HSV
- hsv(29, 73%, 88%)
- CMYK
- cmyk(0%, 38%, 73%, 12%)
- LAB
- lab(66.0 28.7 54.1)
- OKLCH
- oklch(71.2% 0.138 59.8)
Guide
Which format should you use?
HEX is the web's lingua franca: six digits, universally supported, perfect for CSS and design tools. RGB is the same information spelled out per channel, handy when you need to tweak transparency (that's what the RGBA row is for).
HSL is the format to edit by hand: hue is the color wheel angle, saturation is intensity, lightness is self-explanatory. Making a hover state? Keep H and S, nudge L. HSV is its cousin used by most color pickers (Photoshop's picker is HSV).
CMYK approximates ink coverage for print. Note that real print conversion depends on the printer's ICC profile. Treat our values as a starting point and always check a physical proof for brand-critical work.
LAB and OKLCH are perceptual spaces: distances in them roughly match how different colors look. OKLCH is now native in CSS and is the best choice for generating consistent shade scales: equal lightness steps actually look equal, which isn't true in HSL.
FAQ
Common questions
- How do I convert hex to RGB?
- Paste the hex into the converter and the rgb() value appears alongside HSL, HSV, CMYK, Lab, and OKLCH. Under the hood each hex pair is one channel in base 16: #FF6B35 is rgb(255, 107, 53).
- How accurate is the CMYK conversion?
- It is a standard formula approximation. Real print output depends on the printer's ICC profile, inks, and paper, so treat the CMYK values as a starting point and proof anything brand-critical with the actual vendor.
- Can I convert a whole list of colors at once?
- Yes: switch to bulk mode, paste one color per line in any mix of formats, and copy the converted list back out in the format you need.
- What is OKLCH and why would I use it?
- A perceptually uniform color space now native in CSS: equal lightness steps look equal to the eye. Use it for shade scales and gradients; the converter shows the oklch() form of any color you paste.