How to use the color picker
- Drop or choose an image. It's drawn locally — nothing is uploaded.
- Hover to preview any pixel's color, and click to copy the HEX and add it to your palette.
- Use the extracted palette below the image to grab the dominant colors in one click.
- Eyedrop from screen (Chrome/Edge) to sample a color from any window, not just the image.
HEX, RGB, HSL and HSV — which to use?
| Format | Looks like | Best for |
|---|---|---|
| HEX | #2DD4BF | CSS, design tools — the most common |
| RGB | rgb(45, 212, 191) | CSS with opacity, code |
| HSL | hsl(172, 66%, 50%) | Tweaking — change lightness for shades |
| HSV/HSB | hsv(172, 79%, 83%) | Design apps like Photoshop & Figma |
Frequently asked questions
How do I pick a color from an image?
Drop an image, hover to preview, and click to grab a color as HEX/RGB/HSL/HSV — it's copied and added to the palette. The image stays on your device.
HEX vs RGB vs HSL vs HSV?
Same color, different notation. HEX/RGB are how screens store color; HSL/HSV are easier for adjusting hue and lightness.
Can I pick from anywhere on screen?
Yes in Chrome and Edge via the screen eyedropper button. Other browsers use the image picker.
Is my image uploaded?
No — it's read locally on a canvas. Nothing is sent anywhere.
More free tools
For designers and video: Aspect Ratio Calculator · Text styling: Fancy Text Generator · See all Alienated Tools.