Loading tool…
Spotted the perfect shade in a photo, a logo or a screenshot? Open the image, hover to see the colour under your cursor and click to capture its exact HEX, RGB and HSL values, ready to copy into your code or design tool.
Processing locally on your device
Overview
Every pixel in a digital image is stored as red, green and blue values from 0 to 255, giving about 16.7 million possible colours. A colour picker reads those values at the point you choose. This tool samples the image at its full resolution, not the scaled-down preview you see on screen, so clicking a thin line or a small detail returns the true pixel value rather than a blend of its neighbours.
Results are shown in three formats. HEX, like #1E90FF, is the six-digit hexadecimal notation used in CSS, HTML and most design apps. RGB, like rgb(30, 144, 255), lists the same three channels in decimal. HSL, like hsl(210, 100%, 56%), describes the colour as hue on a 0–360° wheel, saturation and lightness, which makes it easy to create lighter, darker or muted variations by changing a single number. Each format has its own copy button.
Moving the cursor over the image shows a live preview of the colour beneath it, so you can find the exact spot before clicking. Every pick is added to a history of up to 36 swatches, and clicking a swatch copies its HEX value. Because photos contain noise and gradients, neighbouring pixels can differ slightly; picking a few spots and comparing swatches helps you settle on the representative colour.
| Format | Example | Range | Best for |
|---|---|---|---|
| HEX | #1E90FF | 00–FF per channel | CSS, HTML, design tools |
| RGB | rgb(30, 144, 255) | 0–255 per channel | Code, image processing |
| HSL | hsl(210, 100%, 56%) | Hue 0–360°, S and L 0–100% | Creating tints, shades and themes |
Open an image by dragging it in, browsing or pasting.
Hover over the image to preview the colour under the cursor.
Click to pick the colour and see its HEX, RGB and HSL values.
Copy the format you need, or click a swatch in the history to copy its HEX.
Use cases
Extract the exact HEX code from a client’s logo file or a screenshot of their website when no brand guide is available.
Grab colours from a design mockup image and paste them straight into CSS or a theme file.
Pick a wall or fabric colour from a photo to look up matching paint or textiles.
Sample skin tones, sky colours or shadows from reference photos to build a natural palette.
Pro tips
Answers to common questions about the color picker.
Photos are affected by lighting, camera processing and JPEG compression, so the pixel value may be slightly off. For brand work, sample from an original PNG or SVG export rather than a photo.
Yes. The click position is mapped back to the full-resolution image and that single pixel is read, regardless of how small the preview is.
They store the same information. HEX writes the red, green and blue values in base 16 (00–FF), while RGB writes them in base 10 (0–255).
Values are shown as HEX, RGB and HSL without an alpha component, so the result describes the colour of the pixel itself.
The history keeps up to 36 swatches. Click any swatch to copy its HEX code.
No. ToolEnhancer processes files on your own device inside the browser. They are never sent to, stored on or seen by our servers.
Yes. The color picker is free to use with no sign-up, no watermarks and no daily limits.
Strip location and camera metadata from photos.
Extract dominant colours as HEX, RGB and HSL.
Inspect RGB and luminance histograms.
Diff two images side by side or overlaid.
Encode images as data URIs for HTML and CSS.
Create QR codes with colours and logos.