Color picker Free
Pick any colour with a hue and shade square, read it as HEX, RGB, HSL and HSV, sample colours from your own image or screen, and copy values.
Arrow keys: left/right for saturation, up/down for brightness. Hold Shift for steps of 10.
Sample from an image or the screen
The screen eyedropper needs the EyeDropper API, which this browser does not support (it is available in Chrome, Edge and Opera on desktop). You can still open an image and sample from it.
Current colour #3b82f6
Recent colours
Colours you copy, sample or save appear here. They are stored only in this browser.
About Color picker
Color picker is a quick way to find one exact colour and get it in every common notation. Drag in the shade square and the hue bar, or use the arrow keys, and the HEX, RGB, HSL and HSV values update together. Each value is an editable box, so you can also paste a code you already have and see it.
You can sample colours from a photo or screenshot: open it on the page and click, tap or move the cursor with the keyboard to read the pixel underneath. In browsers that support it, the eyedropper can pick any colour on your screen. The colours you use are kept in a short recent list on this device.
How to use it
- Drag in the square to set saturation and brightness, and move the hue slider to change the colour family. With the keyboard, focus the square and use the arrow keys (hold Shift for bigger steps).
- Or type or paste a value into the HEX, RGB, HSL or HSV box.
- To sample a colour, open an image and click or tap it, or focus the image and move the cursor with the arrow keys. Use the eyedropper button to pick from anywhere on screen where supported.
- Press Copy next to any value. Copied and sampled colours are added to the recent list.
Good to know
- The screen eyedropper uses the EyeDropper API, which is available in Chrome, Edge and Opera on desktop. Other browsers can still sample from an image.
- Images are sampled at up to 4,096 pixels on the longest side; very large photos are scaled down first, which can average fine detail.
- Recent colours are stored in this browser only and may be cleared by private browsing or site-data settings.
- Values are rounded to whole numbers, so converting HSL or HSV back to HEX can move a colour by one step.
Questions and answers
What is the difference between HSL and HSV?
Both describe hue the same way. HSL measures lightness, where 100% is always white; HSV (also called HSB) measures value or brightness, where 100% is the brightest version of the hue. Design apps such as Photoshop and Figma use HSV/HSB in their pickers.
Why is the eyedropper button unavailable?
Your browser does not support the EyeDropper API. It is currently available in Chromium-based desktop browsers. Open a screenshot as an image instead and sample from it.
Does the image leave my device?
No. The image is decoded and sampled locally on a canvas in your browser and is never uploaded.
How do I make a whole palette?
Use the Color palette generator, which builds matching colours from one base colour and checks contrast.