Color Picker
Pick any color or type a HEX code to get its HEX, RGB and HSL values instantly -- with a live preview and one-click copy. Runs entirely in your browser.
How it works
Use the color picker to choose any color, or type a HEX code into the box. The preview and the HEX, RGB and HSL values update instantly, and each value has its own Copy button so you can paste it straight into CSS, a design tool or a document. The tool also suggests whether white or black text reads better on your color. Everything runs locally in your browser.
Is my data sent to any server?
No. The color picker runs entirely in your browser. Nothing you pick or type is uploaded, stored, or included in analytics.
What is the difference between HEX, RGB and HSL?
They are three ways of writing the same color. HEX is a six-digit code used in web design (#4F46E5). RGB gives the red, green and blue amounts from 0 to 255. HSL describes hue (0-360 degrees), saturation and lightness (0-100%), which is handy for making lighter or darker shades.
Can I type a HEX code instead of picking?
Yes. Type or paste any 3- or 6-digit HEX code, with or without the # -- for example #FFF or 4F46E5 -- and the preview and all values update instantly. Invalid codes are flagged so you can fix them.
What does the best text color line mean?
It checks whether white or black text is easier to read on your chosen color, using the WCAG contrast ratio. A ratio of 4.5:1 or higher is recommended for normal body text.
More creator utilities are in our Creator Tools. See our Privacy Policy and Terms of Use for more detail.