Pick a color and get its HEX, RGB, CMYK, HSV and HSL values instantly

A color picker is a free online tool that lets you choose a color and instantly read its value in five formats: HEX, RGB, CMYK, HSV and HSL. Pick a color on the palette or paste a HEX or RGB value, then copy the format you need with one click. It also includes a WCAG contrast checker so you can test a text color against a background color and confirm it is accessible. Everything runs in your browser, free and with no registration.

HEX

RGB

CMYK

HSV

HSL

Color

WCAG contrast checker

Check that a text color is readable on a background color. WCAG 2.1 requires a ratio of at least 4.5:1 for normal text and 3:1 for large text.

Text color (HEX)

Background color (HEX)

Contrast ratio

Sample text: check how readable this is

AA normal text (4.5:1)
AA large text (3:1)
AAA normal text (7:1)
AAA large text (4.5:1)

How to use the color picker

Pick a color on the palette, or type a HEX or RGB value to see the color it represents.
Copy any of the five formats with the copy button next to it.
Scroll to the contrast checker to test a text color against a background color and see which WCAG levels it passes.

Which color format should you use?

Format	Best for	Example
HEX	Websites, CSS, design tools	#f4ae00
RGB	Screens, CSS with transparency (rgba)	rgb(244, 174, 0)
CMYK	Print: brochures, packaging, business cards	0%, 29%, 100%, 4%
HSV	Color pickers in graphics software	hsv(43°, 100%, 96%)
HSL	CSS palettes: lighter and darker shades of the same hue	hsl(43°, 100%, 45%)

Common uses

Matching a brand color when all you have is a HEX code from a designer.
Converting a web color to CMYK before sending files to print.
Checking that button and body text meet the WCAG 2.1 contrast requirement of 4.5:1.
Building a CSS palette: keep the hue and saturation, change only the HSL lightness.

FAQ about the color picker

Is the color picker free to use?

Yes, the color picker and the contrast checker are completely free, with no registration and no usage limits.

What is the difference between HEX, RGB, CMYK, HSV and HSL?

HEX and RGB describe the same screen colors in different notations: HEX is the compact form used in CSS and design tools, RGB lists the red, green and blue values. CMYK describes ink coverage for print. HSV and HSL describe a color by hue, which makes them convenient for building palettes and adjusting brightness.

How do I convert HEX to RGB?

Paste the HEX value in the HEX field and the RGB value appears immediately in the RGB field. The conversion also works the other way: type an RGB value and you will get the HEX code.

What contrast ratio do I need for accessibility?

WCAG 2.1 level AA requires a ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt and above, or 14pt bold). Level AAA requires 7:1 for normal text. The contrast checker on this page shows which of these levels your color pair passes.

Can I convert a screen color to a print color?

Yes, the tool shows the CMYK value of any color you pick. Keep in mind that CMYK conversion is an approximation: the final printed color also depends on the printer profile and the paper, so always request a printed proof for brand-critical colors.

Color picker