Skip to content
← All guides

Color Converter

One colour, six notations, each suited to a different job. The converter keeps them in sync as you edit any of them, so you can reason in whichever space fits the task and copy out whichever one your tooling expects.

Open the Color Converter

Which space to think in

HEX and RGB address the screen. HSL and HSV are for adjusting by hand — nudge lightness, keep the hue. OKLCH is perceptual, which makes it the right space for generating scales. CMYK is for print, and only at the end.

What is lossless and what is not

HEX, RGB, HSL and HSV are different descriptions of the same sRGB value, so converting between them round-trips exactly. OKLCH can describe colours sRGB cannot show, and CMYK covers less than the screen does — both of those conversions are approximations, and the tool shows you the closest achievable result.

Nothing leaves your browser

Every conversion is arithmetic performed locally. No colour you type is sent to a server, which also means the tool keeps working with the network off.

Step by step

  1. Type or paste a value into any field — the others update immediately.
  2. Use the HSL or HSV fields to make a lighter or darker variant by hand.
  3. Switch to OKLCH when you need a scale where lightness changes without the hue drifting.
  4. Copy the notation your framework or design tool expects.

Frequently asked questions

Why do the numbers sometimes differ by one after a round trip?

HSL and HSV percentages are rounded to whole numbers for readability. Rounding 60.4% to 60% and converting back can land a step away in RGB. It is invisible on screen but explains the discrepancy.

How accurate is the Pantone match?

It is the nearest colour in the reference set, computed numerically. Treat it as a starting point for a conversation with your printer, not as a specification — ink on paper under real lighting is not something a screen can promise.

Should I store colours as OKLCH in production?

You can — browsers support it — but keep a fallback for older ones. Many teams author scales in OKLCH and ship the resolved sRGB values, which gets the perceptual benefits without the compatibility question.

✓ Copied