Skip to content
EN

Color picker and code converter

Pick a color or paste a code: instant conversion to HEX, RGB, HSL and CMYK, screen eyedropper, shades and contrast. Free, in your browser.

  • Free
  • No sign-up
  • No file uploaded
  • Windows, Mac, Android, iPhone

Loading the tool…

Share this tool

About this tool

You have a HEX code and need RGB for an app, HSL for a stylesheet or CMYK for a printer? Pick the color or paste its code: all four formats appear together, each with a Copy button. The eyedropper picks a color anywhere on your screen.

When to use it

Move between apps

A HEX code from a mockup to enter as RGB in an office app, or the other way round.

Prepare for print

Get a first CMYK value for a screen color, to confirm with your printer.

Find a color

Use the eyedropper to pick the color of a logo or page shown on screen.

How to use

  1. Pick a color in the picker, or paste a code or color name.
  2. Read the color in HEX, RGB, HSL and CMYK.
  3. Copy the format you need.
  4. Use the eyedropper, shades or contrast check if needed.

How it works

Conversions are calculated in your browser: HSL from the hue, saturation and lightness of the RGB color, CMYK from the theoretical formula with no ICC profile. CSS names (“tomato”, “navy”…) are read by the browser engine.

The eyedropper uses the EyeDropper API, available in Chrome and Edge on desktop. Contrast with white and black follows the WCAG 2 formula.

Tips for best results

  • For text on white, aim for at least 4.5:1 contrast (AA level).
  • HSL makes variants easy: change only the lightness for a lighter or darker tint.
  • For professional printing, use your printer's CMYK profile rather than a theoretical conversion.
  • To build several colors that go together, move on to the color palette generator.

Common problems and fixes

The eyedropper doesn't show

It only exists in Chrome and Edge on desktop. Elsewhere, take a screenshot and use “Image colors”.

Printed CMYK doesn't match the screen

Screens mix light, printers mix ink: some bright colors can't be printed. Ask your printer for a proof.

My code isn't recognized

Check the format: #rrggbb, rgb(r, g, b), hsl(h, s%, l%) or cmyk(c%, m%, y%, k%).

Frequently asked questions

What's the difference between HEX and RGB?

It's the same color written differently: HEX gives the red, green and blue values in hexadecimal, RGB as numbers from 0 to 255.

Is the CMYK value exact?

It's a theoretical conversion. The printed result depends on the paper, inks and the printer's profile.

Can I type a color name?

Yes, every CSS name works: “tomato”, “navy”, “rebeccapurple”…

How do I pick a color from the screen?

With the eyedropper button, in Chrome or Edge on desktop: then click anywhere on the screen.

Are my colors sent anywhere?

No, everything is calculated in your browser; the last color stays in your browser for your next visit.

Related searches

Still stuck?

Ask on the forum: the category, the tool, your device sheet and the test result will be filled in for you.