Is the image uploaded to read the hex code?

The hex code is worked out in this tab: the Canvas API returns the pixel's red, green and blue values, and the tool formats them as hex. Our servers are not involved at any point.

Why is the hex code useful?

Hex codes are the standard way to specify colors in CSS, design tokens, and most graphics formats. A six-digit hex like #2563eb maps directly to an RGB color.

How do I copy a hex code?

Click Copy next to the HEX value under Current pick. To copy an earlier pick, click its swatch in the history first. You will see a Copied! confirmation for a moment, then it returns to the default label.

Does the picker work with PNG transparency?

It reads the red, green, and blue values of the pixel under your cursor and leaves out its transparency. A semi-transparent pixel shows its color before blending with the background, and a fully transparent pixel reads as #000000.

Can I sample colors from very large images?

Yes. The image is drawn at its natural resolution to a hidden canvas, and the display scales down to fit your screen. Click positions are mapped to source pixels automatically.

Get Hex Color from Image

Drop an image, click a pixel, and read its hex color. The tool also shows RGB and HSL values, keeps a history strip of your recent picks, and has a copy button for each value of the current pick. All processing runs in your browser using the Canvas API.

Drop an image or click to choose

JPG, PNG, WebP, GIF, SVG, AVIF. Runs in your browser.

CURRENT PICK

Choose an image to begin.

HOVER

#000000

Hover over the image.

ACTIONS

Runs entirely in your browser

How it works

The tool draws your image to a hidden HTML canvas at its natural resolution. When you click a pixel, the Canvas API call ctx.getImageData(x, y, 1, 1).data returns the RGBA values of that pixel, after the browser has converted any embedded color profile to sRGB. Those values are formatted as hex, RGB, and HSL, and the color is added to a small history strip of recent picks.

Processing runs in your browser

All color sampling happens locally in your browser tab using the Canvas API. Our servers are not involved at any point.

Frequently asked questions

Is the image uploaded to read the hex code?: The hex code is worked out in this tab: the Canvas API returns the pixel's red, green and blue values, and the tool formats them as hex. Our servers are not involved at any point.
Why is the hex code useful?: Hex codes are the standard way to specify colors in CSS, design tokens, and most graphics formats. A six-digit hex like #2563eb maps directly to an RGB color.
How do I copy a hex code?: Click Copy next to the HEX value under Current pick. To copy an earlier pick, click its swatch in the history first. You will see a Copied! confirmation for a moment, then it returns to the default label.
Does the picker work with PNG transparency?: It reads the red, green, and blue values of the pixel under your cursor and leaves out its transparency. A semi-transparent pixel shows its color before blending with the background, and a fully transparent pixel reads as #000000.
Can I sample colors from very large images?: Yes. The image is drawn at its natural resolution to a hidden canvas, and the display scales down to fit your screen. Click positions are mapped to source pixels automatically.

Last reviewed September 30, 2026

Other pages for this tool

Related tools

Background reading: Complete guide to image tools
Step by step: Build a color system for a design project