Image Color Picker

That perfect colour in a photograph — the exact blue of a product, the warm tone of a brand image — has a code, and this eyedropper finds it. Upload any image, click (or tap) the point whose colour you want, and get its precise HEX, RGB and HSL values, ready to copy into your design tool or stylesheet. The tool also extracts a palette of the image’s dominant colours automatically, which is how you build a colour scheme that genuinely belongs to a picture: website themes that echo a hero photo, presentations that match their imagery, social templates drawn from the product itself. Your image never leaves your device.

Quick Answer: Upload an image, click any point to sample its exact colour in HEX, RGB and HSL, and copy the auto-extracted dominant palette.

Free Online Tool

Click the colour you love — take its code.

Choose an image

—HEX

—RGB

—HSL

Dominant palette

How to Use the Image Color Picker

Upload the image you want to sample from.
Click or tap any point on the image — the sampled colour and its codes appear instantly.
Click several points to compare areas; each new click replaces the sample.
Browse the dominant-colours palette the tool extracted from the whole image.
Click any palette colour to load its codes, then copy what your project needs.

Key Features

Precise eyedropper sampling with HEX, RGB and HSL readouts.
Automatic dominant palette extraction (six colours) from any image.
Zoom-friendly: samples the true pixel, not the screen average.
One-click copy for every code format.
Private by design — the image is processed on your device only.

Best Practices and Tips

Sample several spots in the same region and pick the middle value — JPEG noise makes neighbouring pixels differ slightly.
For brand work, sample the product in its most representative photo, then check the palette against screens and print proofs.
Build a page theme from the hero image’s palette and the design will feel coordinated without anyone knowing why.
Shadow areas give you the dark variant of a colour story; highlights give the tint — a palette across both makes complete schemes.
Combine with the Gradient Generator: sampled colours become gradient stops that belong to the image.

Common Mistakes to Avoid

Sampling a single pixel of a textured or noisy area and treating it as ‘the’ colour of that region.
Picking colours from a heavily filtered photo and expecting them to match the real-world product.
Forgetting that screens differ — a sampled code is exact data, but its appearance still varies by display.
Using the lightest extracted colour for text backgrounds without a contrast check.

Frequently Asked Questions

How accurate is the sampled colour?

Exact for the pixel you click, as stored in the image file. Bear in mind photographs contain thousands of near-identical pixels from compression and texture — the palette extraction averages intelligently across regions, which is often the more useful ‘colour of that area’ answer.

How does the automatic palette work?

The image is analysed in your browser: pixels are grouped into colour families and the most representative colours are chosen, favouring coverage and variety. Six swatches give you the image’s colour story at a glance, each clickable for its codes.

Can I sample from a screenshot?

Yes — screenshots are images. Upload the PNG or JPG and click the UI element whose colour you need. It is a standard trick for matching a design to an existing app or website reference.

What formats are the codes in?

HEX (#RRGGBB) for design tools and CSS, RGB for code and documentation, and HSL for when you want to adjust lightness or saturation while keeping the hue. All three are shown for every sample and palette swatch.

Is my image uploaded anywhere?

No. Reading pixels requires the image only inside your browser, which is exactly where it stays. Personal photos and unreleased product shots are safe to sample.