Color Picker
Pick and convert colors between HEX, RGB, HSL, HSV, and CMYK online for free. Includes WCAG contrast checker and color harmonies.
WCAG Contrast
Get more from MyEasyTools — No ads, higher limits, faster processing
How to use the Color Picker online for free
- Click the colour swatch or paste a HEX/RGB/HSL value into any input field (no signup needed)
- All five colour format outputs — HEX, RGB, HSL, HSV, and CMYK — update instantly
- Use the alpha slider to add transparency, or the Eyedropper tool to sample any colour on screen (Chrome and Edge)
- Click Generate Palette to get five harmony sets, then copy any value to your clipboard
Why use our Color Picker?
Designers and developers constantly need to convert between colour formats — a designer works in HEX, CSS uses RGB and HSL, print workflows need CMYK, and Tailwind configs use HSL. Our picker outputs all five simultaneously, so you can grab what you need without a separate converter.
The built-in WCAG contrast checker tells you whether your foreground/background colour combination passes AA or AAA accessibility standards — critical for anyone building accessible web interfaces. Colour harmonies (complementary, analogous, triadic, split-complementary, tetradic) give you a starting palette with one click.
Accessibility tip: WCAG AA requires 4.5:1 contrast for normal body text and 3:1 for large text (18pt+ or bold 14pt). AAA raises this to 7:1 — aim for it on primary UI text and interactive elements. Always test your colours against both white and dark backgrounds if you support a dark mode.
Everything runs in your browser with no server calls. Recent Colors saves your last picks for quick access across sessions. The EyeDropper tool (Chrome/Edge desktop) lets you sample any colour visible on screen. Free, no account required.
Frequently Asked Questions
A HEX color code is a six-digit hexadecimal number (e.g. #3B82F6) that represents a color in the RGB model. Each pair of digits represents the red, green, and blue channels (0–255). HEX codes are widely used in web design, CSS, and graphic design software.
Split the HEX code into three pairs and convert each from base-16 to base-10. For example, #3B82F6 → R=0x3B=59, G=0x82=130, B=0xF6=246. This tool converts HEX to RGB automatically as you pick any color.
Both use Hue (the color angle 0–360°), Saturation (color intensity), and a third component. HSL uses Lightness (0% = black, 50% = full color, 100% = white), while HSV uses Value/Brightness (0% = black, 100% = full brightness). HSL is more intuitive for lightening or darkening a color; HSV matches many professional color-picker UIs.
CMYK stands for Cyan, Magenta, Yellow, and Key (Black). It is a subtractive color model used in color printing. Designers converting from screen (RGB) to print (CMYK) need to be aware that some vivid RGB colors cannot be accurately reproduced in CMYK.
The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios for text legibility. AA level requires 4.5:1 for normal text and 3:1 for large text. AAA (enhanced) requires 7:1 for normal text. This tool shows your color's contrast against white and black so you can meet accessibility standards.
The EyeDropper lets you sample any color visible on your screen — from images, web pages, or other apps — and import it directly into the picker. It uses the browser's native EyeDropper API, supported in Chrome and Edge. Safari and Firefox do not yet support this feature.
Color harmonies are sets of colors that look visually balanced together, based on their positions on the color wheel. Complementary colors are opposite each other (high contrast). Analogous colors are adjacent (cohesive). Triadic colors form an equilateral triangle (vibrant balance). This tool generates all five major harmony types from your chosen color.
Yes — the color picker works in any mobile browser. Note: the EyeDropper API (pick a colour from your screen) requires Chrome on desktop or Android; Safari on iOS does not support EyeDropper. Manual colour entry and all format conversions work on every browser.