Does the eyedropper send my image anywhere?

The eyedropper samples pixels from a canvas inside this tab, and the magnifier is drawn from the same canvas. Our servers are not involved at any point.

What is an eyedropper tool used for?

Designers and developers use an eyedropper to grab brand colors from logos, sample shades from photos, identify CSS colors from screenshots, or match accent colors across assets.

How does the on-screen magnifier work?

When you press or hover near a pixel, a small zoomed view of the surrounding pixels appears so you can place the sample point exactly where you want it.

Can I sample multiple colors in one session?

Yes. Every pick goes into a history strip showing the last five colors. Click any swatch to bring it back into the main display, then copy its hex, RGB, or HSL value.

Which color formats does it output?

Each pick shows the hex code, the RGB triplet, and the HSL value. Copy any of them with the Copy button next to each value.

Eyedropper Tool

Use the eyedropper to sample any color from an image you open. Click a pixel to read its hex, RGB, and HSL values, and keep the last five picks in a quick-access history. 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

Does the eyedropper send my image anywhere?: The eyedropper samples pixels from a canvas inside this tab, and the magnifier is drawn from the same canvas. Our servers are not involved at any point.
What is an eyedropper tool used for?: Designers and developers use an eyedropper to grab brand colors from logos, sample shades from photos, identify CSS colors from screenshots, or match accent colors across assets.
How does the on-screen magnifier work?: When you press or hover near a pixel, a small zoomed view of the surrounding pixels appears so you can place the sample point exactly where you want it.
Can I sample multiple colors in one session?: Yes. Every pick goes into a history strip showing the last five colors. Click any swatch to bring it back into the main display, then copy its hex, RGB, or HSL value.
Which color formats does it output?: Each pick shows the hex code, the RGB triplet, and the HSL value. Copy any of them with the Copy button next to each value.

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