Image Color Picker and Palette Extractor

Load a picture, click anywhere on it to grab the exact colour under your cursor, and copy the HEX, RGB or HSL value. The tool also pulls out a palette of the main colours automatically. Your image is read straight off the canvas in your browser and is never sent anywhere.

Drag and drop an image here, or click to choose a file

JPG, PNG, WebP and GIF are supported. Files stay on your device.

Click on the image to pick a colour. Move the cursor to preview before clicking.

Picked colour

Palette

Colours are read directly from the image pixels by your browser using the Canvas API. The picture itself is never uploaded to a server.

Grab Exact Colours From Any Image

Designers and developers constantly need the precise colour of a pixel: the blue in a logo, the background of a screenshot, the accent in a photo. This image colour picker turns your picture into a clickable canvas, reports the value under your cursor in three common formats, and lets you copy any of them with a single click. Alongside the picker, it scans the whole image and builds a palette of the most common colours, so you can lift a ready made scheme straight from a reference image.

Use it to match brand colours, rebuild a theme from a screenshot, sample tones from a photo for a design, or pull a colour scheme out of artwork.

How to Pick a Colour

  1. Open an image. Drop in or select a picture and it appears on the canvas.
  2. Click a pixel. Click anywhere on the image to capture the colour at that point.
  3. Copy the code. Copy the HEX, RGB or HSL value, or click a palette swatch to copy its HEX.

Three Colour Formats

Every pick is shown as HEX for CSS and design tools, RGB for code, and HSL for adjusting hue, saturation and lightness. Copy whichever your project needs.

Automatic Palette

The tool samples the image and groups similar tones to surface the dominant colours, giving you an instant palette you can borrow for a coherent design.

Reads Pixels Locally

The image is drawn to a canvas in your browser and the colours are read from there. Nothing is uploaded, so private mockups and screenshots stay on your machine.

Handy Reasons to Use It

  • One click copy: grab HEX, RGB or HSL instantly.
  • Palette in seconds: the main colours of any image, ready to reuse.
  • No upload: pixels are read in your browser and stay private.
  • No cost: free with no account and no watermark on anything.
  • Any device: works with a click on desktop or a tap on mobile.

Common Uses for the Color Picker

The most frequent reason people open this tool is to get the hex code of a colour they can see in a photo or screenshot. Drop in a logo and click the mark to read off the exact brand colour, or click the background of a screenshot to match a website colour to an image you are working from. Every pick gives you the value in three formats at once: a HEX code such as #1A73E8 to paste into CSS or a design app, an RGB string like rgb(26, 115, 232) for code, and an HSL string for adjusting hue, saturation and lightness. A copy button sits next to each one, so finding the RGB value of a single pixel is just a click and a copy.

It is also a quick way to build a palette from a picture. When the image loads, the tool reads the pixels and lists up to eight of the most common colours as swatches, each with its HEX code below it. Click a swatch to load that colour into the main readout, or click the code to copy it straight to your clipboard. That makes it easy to lift a colour scheme out of artwork, a photo or a moodboard, or to pull a set of matching tones from a reference image without guessing.

Frequently Asked Questions

Open your image, then click the spot you are interested in. The colour at that pixel appears as HEX, RGB and HSL, each with a copy button.

Yes. As soon as the image loads, the tool analyses it and shows a palette of the most common colours. Click any swatch to copy its HEX value.

No. The picture is drawn onto a canvas in your browser and the colour values are read from there. The file is never sent to a server.

They are three ways to write the same colour. HEX is common in CSS, RGB lists red, green and blue values, and HSL describes hue, saturation and lightness, which is handy for tweaking shades.

Yes. Tap the image to sample a colour. The tool works in mobile browsers without any app.

It reads the exact pixel value from the image data, so the colour is taken straight from the source rather than estimated.

Yes. You can sample any visible pixel. Fully transparent areas report no colour because there is nothing to read there.

Yes, it is completely free, needs no account, and adds nothing to your image.

Load the image, then click the spot you want. The HEX field shows the code for that pixel, for example #1A73E8, and the Copy button next to it puts the code on your clipboard ready to paste into CSS or a design tool.

Click the pixel on the image and read the RGB field, which shows the colour as rgb(red, green, blue), for example rgb(26, 115, 232). Use its Copy button to grab the value. The same pick is also shown as HEX and HSL.

Open the logo image and click directly on the coloured part of the mark. The picked colour appears as HEX, RGB and HSL with copy buttons, so you can lift the exact brand colour. The auto palette beside it also lists the main colours in the logo as swatches you can copy.

Yes. The picture is drawn onto a canvas in your browser and the colours are read from the pixels right there. Nothing is sent to a server, so the file never leaves your device.

Related Tools