The "close enough" hex code problem
You've seen a color you want — a brand's exact blue on their website, a shade in a photo you're referencing for a design — and the usual move is opening a color-picker app, eyeballing it against the screen, and landing on something that's close but not quite right. Ship that near-match into a real design and it's the kind of subtle mismatch that makes two elements that should be identical look slightly, naggingly off next to each other.
The fix isn't a better eye for color, it's reading the actual stored value instead of guessing from what your monitor happens to display it as.
Why a screenshot isn't the same as the source pixel
A screenshot introduces its own chain of small distortions — monitor calibration, color profile conversion, sometimes compression if the screenshot gets saved as JPEG — each of which can nudge a color's stored value slightly away from what was originally intended. Reading a pixel directly from the original uploaded image file, using the same underlying method browsers use internally to read pixel data, skips all of that: you get the value that's actually stored in the file, not a value that's passed through a screenshot's extra layer of interpretation.
This distinction matters most when precision counts — matching a specific brand color exactly, rather than getting visually close.
PNG vs JPEG as your source matters more than people expect
If the image you're sampling from is a JPEG, be aware that lossy compression can shift individual pixel values slightly from the true original color, especially near sharp edges between two colors. A losslessly-saved PNG doesn't have this issue — what's stored is exactly what was originally there. If you have a choice of source file and color accuracy matters, always reach for the PNG.
This also explains a common confusing moment: sampling what looks like the same flat color from two different spots in a JPEG and getting two very slightly different hex codes back. That's not a bug in the tool — it's compression noise in the source file being read accurately.
Watch out for edges and anti-aliasing
Clicking right at the boundary between two colors in an image often gives you neither color cleanly — most images have anti-aliased edges, meaning the boundary pixels are a blended intermediate between the two colors on either side. If a sampled color looks unexpectedly odd or muddy, click again a few pixels further into the solid area you actually meant to sample, away from any edge.