Color Converter
Convert colors between HEX, RGB, HSL, HSV, HWB, OKLCH, and CMYK instantly in your browser. Pick a color visually and copy any format with one click
CODE
HEX
RGB
R G B
HSL
H° S% L%
HSV non-CSS
H° S% V%
HWB
H° W% B%
OKLCH
L% C H°
CMYK non-CSS
C% M% Y% K%
CSS
Runs 100% Locally in Your Browser
This tool processes your data entirely on your device. Nothing is uploaded, stored, or sent to any server.
No Uploads
Privacy First
Secure by Default
Related Tools
JSON Beautifier Paste your minified or messy JSON and get clean, properly indented output for easier reading, debugging, and development
JSON Minify Convert formatted or messy JSON into inline JSON instantly. Minify JSON by removing unnecessary whitespace and generate a compact single-line string
CSS Minifier Paste your CSS and get a compact, minified version instantly. Remove comments, whitespace, and redundant characters to reduce file size and improve page load performance
CSS Beautifier Paste minified or messy CSS and get clean, properly indented output instantly. Format your stylesheets for easier reading, debugging, and development
Frequently Asked Questions
What color formats does this converter support?
HEX, RGB, HSL, HSV (HSB), HWB, OKLCH, and CMYK. All fields update live in every direction — change any one value and the rest sync instantly.
What is the difference between HSL and HSV?
Both use the same hue angle but differ in their second and third channels. HSL expresses lightness on a scale from black to white with full saturation in the middle; HSV expresses value (brightness) from black to the pure hue, making it closer to how painters think about adding black to a color.
What is HWB and when is it useful?
HWB (Hue, Whiteness, Blackness) describes a color by its hue, the amount of white mixed in, and the amount of black mixed in. It is a native CSS Color Level 4 function and is often more intuitive for designers than HSL.
What is OKLCH and why is it better than HSL for design systems?
OKLCH is a perceptually uniform color space — equal steps in L, C, or H produce visually equal-looking steps. This makes it ideal for building accessible color palettes and design tokens where consistent contrast ratios matter.
Why are HSV and CMYK marked 'non-CSS'?
The CSS color specification does not include hsv() or cmyk() functions. HSV is widely used in design tools (Photoshop, Figma), while CMYK is used in print workflows. Both are included for convenience when converting between design and code contexts.
Can I paste a HEX code with or without the # symbol?
Yes — the HEX input accepts both #rrggbb and rrggbb and normalises them automatically.
Why might an OKLCH color look slightly different after converting back to RGB?
OKLCH can represent colors outside the sRGB gamut. When converting back, out-of-gamut values are clamped to the 0–255 range, which may shift the color slightly toward the gamut boundary.
Is my color data sent to a server?
No. All conversions run entirely in your browser — nothing is transmitted or stored.