Color picker
from an image

Hitting the pixel you actually want

The single most common complaint about online color pickers is that selecting a precise pixel is fiddly. Move one pixel too far and you sample a compression artefact, an anti-aliased edge, or a highlight rather than the color of the object itself. Two features here exist specifically to fix that.

The magnifier enlarges the region under your cursor eight times and draws a reticle around the exact pixel that will be sampled, so what you see is what you get. On a phone it follows your finger, which matters because a fingertip covers far more than one pixel.

Keyboard control takes over where a pointer runs out of precision. Focus the image, then use the arrow keys to move one pixel per press, hold Shift to jump ten, and press Enter to pick. This is also what makes the tool usable without a mouse at all — the current pixel and its color are announced to screen readers as you move.

Step by step

1. Load the image. Drag a file onto the page, choose one from your device, paste with Ctrl+V, or paste an image URL.
2. Position the magnifier. Move the pointer over the image. A loupe enlarges the area under the cursor eight times and outlines the exact pixel being sampled.
3. Click the pixel. Click to pick the color. The HEX, RGB, HSL and OKLCH values appear immediately.
4. Copy the code. Click any value to copy it to the clipboard, or export the whole palette as CSS, Tailwind, SCSS, JSON or SVG.

Picking from screenshots

Screenshots are the fastest path, because you can skip saving a file entirely. Capture the screen, then press Ctrl+V anywhere on this page and the image loads straight from the clipboard. Since nothing is uploaded, this is safe for unreleased work and internal tools.

This is also the reliable way to read a color off a live website. Browser developer tools will show you the CSS value an element was given, but that is not always the color you see: opacity, blend modes, overlaid gradients and backdrop filters all change the rendered result. Sampling a screenshot reports what actually reached the screen.

When the picked color looks slightly off

If a sampled value does not match what you expected, the cause is almost always in the image rather than the tool:

• JPEG compression shifts individual pixels, particularly near hard edges and in flat areas of saturated color. Sample from the middle of a flat region, not next to a boundary.
• Photographs of screens or print carry the lighting of the room and the white balance of the camera. A photo of a logo is not a reliable source for a brand color; the original file is.
• Anti-aliasing blends edge pixels between foreground and background. Text and thin strokes are mostly edge, so pick from a thick area.
• Color profiles. An image tagged with a wide-gamut profile is converted for display, so the value you read is the sRGB equivalent of what you see rather than the original file's raw numbers.

Privacy

Your image stays on your device. Decoding and pixel reads happen through the browser's Canvas API, and palette clustering runs in a Web Worker — no network request carries your image anywhere, and there is no account or history.