Skip to main content
Colortion

Image Color Picker

Upload a photo, drag the markers onto the colors you want, and copy the exact hex codes — no signup, nothing leaves your browser.

How This Tool Works

When you upload a photo, it's drawn onto an HTML canvas element that exists only in your browser's memory — the file itself is never sent anywhere. Each colored marker reads the exact red, green, and blue values of the pixel underneath it directly from that canvas, then converts them to a hex code the same way the RGB to Hex converter does. Dragging a marker re-samples in real time, so you can fine-tune exactly which pixel you're pulling a color from instead of accepting whatever an automatic algorithm decided was "representative."

This manual approach trades a little convenience for a lot of control — useful the moment an auto-generated palette picks a shadow or a compression artifact instead of the actual color you're after.

What to Use It For

  • Pulling exact brand colors from a logo screenshot or product photo when you don’t have the original design file.
  • Building a mood board palette from a photo — a sunset, a fabric swatch, an interior you want to match — for the Colortion generator or your own project.
  • Matching a specific color you saw somewhere online: screenshot it, upload it here, and sample the exact pixel.
  • Checking whether two photos of the "same" product (different lighting, different camera) actually use consistent colors.

Tips for More Accurate Sampling

Zoom into a specific detail before uploading if you need one exact color rather than a general palette — a marker samples a single pixel, so a small, tightly cropped image gives you finer control than trying to hit a tiny detail inside a large photo. Avoid sampling directly on a hard edge between two colors; a marker placed exactly on a boundary can land on an anti-aliased blend pixel that matches neither color you actually wanted.

For lighting-sensitive work like paint or fabric matching, sample the same surface in two or three spots rather than trusting a single point — natural light, shadows, and JPEG compression all introduce small pixel-level variation even across what looks like one uniform color.

Frequently Asked Questions

Is my image uploaded to a server?

No. The image is read directly in your browser using the HTML canvas API and never leaves your device — nothing is sent to Colortion or any third party. This also means it works offline once the page has loaded.

How accurate is the color sampling?

Each marker samples the exact pixel underneath it at the image's full resolution, not a downscaled preview, so the hex code you get matches what a professional eyedropper tool would report for that exact point. Accuracy depends on where you place the marker — a spot in a shadow or a JPEG compression artifact will sample that local color, not necessarily the "true" color of the object.

Can I extract more or fewer than 5 colors?

Yes — use the +/- controls to add or remove sample points, from 3 up to 8. Each new marker samples wherever it lands, so drag it to the exact area you want before copying.

Why do my extracted colors look different from the photo on screen?

Screen brightness, monitor calibration, and the surrounding colors in your peripheral vision all affect how a color appears to your eyes even when the underlying hex value is identical. The hex code sampled is the ground truth — trust the number over the visual impression if the two seem to disagree.

More Color Tools