Color Picker from Image

Color Picker from Image

An on-screen color picker is the fastest way to lift an exact color out of a photo, screenshot, logo, or design mockup. Instead of eyeballing a shade or guessing values, you point at the pixel you want and read its precise code. This tool reads the pixel directly from the image in your browser, so the value you copy is the real color — not a re-compressed approximation.

Every pick is shown in the three formats you actually use: HEX for CSS and design tools, RGB for editors and code, and HSL when you want to reason about hue, saturation, and lightness. Each has its own copy button, and the tool keeps a small strip of your recent colors so you can build up a set without losing earlier picks.

It works on any raster image — product photos, brand assets, UI screenshots, illustrations, or stock images. Because picking happens on your device, large images stay responsive and you can sample as many colors as you like.

How to pick a color from an image

1. Add your image — drag & drop, paste, or choose a PNG, JPG, or WebP.
2. Hover to preview — the hex value follows your cursor across the picture.
3. Click to lock — the picker shows HEX, RGB, and HSL side by side.
4. Copy a code — one click copies any format; recent picks are kept for reuse.

Tip: zoom in for pixel-perfect picks

On a high-resolution photo, two neighbouring pixels can be slightly different shades. Open the image at a larger size, or crop in first, so the pixel under your cursor is exactly the one you mean to sample.