Image Color Picker

Pick a coordinate on your image to get the HEX/RGB color code of that pixel.

When should you use this?

Use this to grab the exact hex/RGB code of a specific color in an image (a logo's blue, say, to reuse in your own design).

When shouldn't you use this?

If the image is low quality or heavily compressed, the picked color can drift from the true original; for a critical brand color, pick from the original source file instead.

Step-by-step

Choose the file in the "Image" field.
Find the position of the spot you care about. Most image editors show the pixel coordinates under your cursor somewhere along the edge of the window.
Type those numbers into "X (px)" and "Y (px)". X counts from the left and Y from the top, so the top-left corner is 0,0.
Click "Pick color". The HEX and RGB values for that pixel appear in the result area.

Example

You're making an invitation for a local club and all you have is their logo. You want the title to match the green in it. Upload the logo, enter a coordinate right in the middle of the green area, and you get a HEX code such as #2E7D32 along with its RGB values. Paste that into Canva, Word or your stylesheet and the color matches. If you pick a point near the logo's edge, you might land on a blended pixel between the green and the background, so aim for the inside of the colored shape.

Picking a colour from an image

A colour picker shows the colour of the point you click in an image as HEX, RGB and similar codes. It is used in design to catch a brand's or a photo's colour and to build a consistent palette for a website. The colour on screen can look slightly different depending on the display's calibration.

Tips for picking colours

In photos a single pixel can be noisy; try several points in a similar region.
Make sure text and background colours have readable contrast (about 4.5:1 for WCAG).
For print, screen colour and print colour (CMYK) can differ.
Save the codes you pick into a palette file.

Things to keep in mind

One pixel doesn't always represent the whole area. Photos have noise and lighting shifts, so sample two or three spots and compare.
Coordinates refer to the image's actual pixel size. Where something sits on a scaled-down preview isn't necessarily where it sits in the file.
A screenshot can carry the color settings of the screen it was taken on. For print work, double-check CMYK values separately.
On a transparent PNG, a coordinate that falls on an empty area may not return a meaningful color.

Frequently asked questions

Is my image uploaded anywhere?

No, processing happens entirely in your browser via the Canvas API — your image never leaves your device.

Will there be quality loss?

Some quality loss during format conversion or compression is normal, more noticeable with lossy formats like JPG.

Which formats are supported?

JPG, PNG, and WebP formats are supported.