Color Tools

Color Converter

Convert between HEX, RGB, HSL, HSV, and CMYK color formats with live preview and sliders.

How to use this tool

  1. Type a hex code such as #d9a441 into the HEX Color field — the swatch and every conversion below update instantly.
  2. Or drag the Hue, Saturation, and Lightness sliders to shape the color visually.
  3. Or enter channel values directly in the R, G, and B inputs (each 0–255).
  4. Hit Random to jump to an arbitrary color whenever you need a starting point.
  5. Read all formats at once in the Conversions grid — HEX, RGB, HSL, HSV, and CMYK.
  6. Use Copy on any value to send that exact string to your clipboard.

Why this tool is helpful

Hand off hex to CSS

Drop a value like #d9a441 straight into stylesheets, SVG fills, or theme tokens, and grab RGB/HSL variants without hand-calculating.

Tune colors with HSL

Adjusting hue, saturation, and lightness directly is far more intuitive than nudging individual RGB channels when you need "a bit darker" or "a bit greener".

Prepare print-ready CMYK

When a design moves to print, grab the CMYK percentages for accurate ink separations and proofs instead of guessing in RGB.

Match colors across tools

Design apps, image editors, and code each favor a different format. Read every representation from a single input color.

Understand HSV for pickers

HSV matches how most color pickers and image-processing filters reason about brightness, which differs subtly from HSL's lightness.

Stay private

Everything runs in your browser. No color data is uploaded, logged, or sent to a server.

FAQ

Which formats does this convert between?

HEX, RGB, HSL, HSV, and CMYK. Enter a color in any of the inputs and all five representations update together.

Is HEX just RGB in another base?

Yes. Hex writes each RGB channel (0–255) in base-16, so #d9a441 is the same color as rgb(217, 164, 65).

Can I enter a shorthand 3-digit hex?

Yes. A value like #abc is expanded to #aabbcc automatically before converting.

What is the difference between HSL and HSV?

Both separate hue, saturation, and brightness, but "lightness" is the midpoint between black and white, while "value" is the brightest channel. They agree on pure colors but diverge on tints and shades.

Why do I need CMYK?

CMYK models subtractive ink mixing for print. RGB is additive light for screens, so a screen color can look different on paper unless converted to its CMYK equivalent.

Are the converted values exact?

Hue and percentage values are rounded to whole numbers for readability, and CMYK uses the standard mathematical conversion rather than a device-specific ICC profile.

Does any of my color data leave my browser?

Never. All conversion happens locally in JavaScript; your input is not sent to, stored on, or logged by any server.