Color Picker
Pick colors and convert between HEX, RGB and HSL.
What is the Color Picker?
A colour picker lets you choose a colour visually and read its value in every notation that matters: HEX for CSS, RGB for canvas and image work, HSL when you want to adjust lightness or saturation without changing the hue.
Frequently asked questions
When should I use HSL instead of HEX?
HSL when you are building a palette. Because hue, saturation and lightness are separate numbers, you can generate a lighter or more muted variant by changing one value — which is far more predictable than guessing at hex digits.
How do I know if my colour has enough contrast to be accessible?
Compare the relative luminance of foreground and background. WCAG asks for a ratio of at least 4.5:1 for normal body text and 3:1 for large text, so a mid-grey on white often fails even though it looks fine to designers with good eyesight.
Color Picker is one of 1 tools in Design Tools on Toolkit Hub, a free collection of browser-based utilities. It requires no account and no installation. Browse all tools.