You Can See Ten Million Colors. You Can Describe Exactly Zero of Them. Here Is Why Numbers Beat Words.
The average human eye can distinguish roughly ten million distinct colors, according to research published in the Journal of the Optical Society of America. That sounds like more than enough to describe any color you might encounter. But ask someone to name a color they are looking at and they will say something like a dark teal or a warm orange. Ask them to reproduce it in software and they will be off by enough to notice.
This gap between what the eye perceives and what numbers capture is the fundamental problem that color picking from images solves. It translates a visual experience into a coordinate system that software can use precisely and reproduce consistently.
The history of formalizing color perception is long and contentious. Isaac Newton first decomposed white light into its spectral components with a prism in 1666, demonstrating that color is a property of light. Thomas Young proposed the three-receptor theory of human color vision in 1802, which Hermann von Helmholtz expanded in the 1850s into the Young-Helmholtz theory still considered substantially correct today: the human retina contains three types of cone cells sensitive to different wavelength ranges, corresponding roughly to red, green, and blue. It took until 1931 for the Commission Internationale de l'Eclairage (CIE) to produce the first mathematical model of color perception, the CIE 1931 color space, which established a reference for all subsequent color standards.
How a Screen Displays Color
Every pixel on a standard display is a cluster of three sub-pixel emitters: red, green, and blue. The brightness of each sub-pixel is controlled by a value from 0 to 255, giving 256 possible intensities per channel and 256 to the power of 3, or approximately 16.7 million, possible color combinations. This is the foundation of the sRGB color model, standardized by Hewlett-Packard and Microsoft in 1996 and adopted as the default color space for the web.
When you sample a color from an image, you are reading the RGB values of a specific pixel or group of pixels and converting them to whatever color format the workflow requires. HEX notation is simply the same three values written in hexadecimal: red as the first two digits, green as the middle two, blue as the last two. RGB(255, 0, 0) is #FF0000. RGB(0, 128, 128) is #008080. The notation changes; the underlying values are the same.
The complication is that colors in images are rarely simple. A photograph contains noise, compression artifacts from JPEG encoding, and lighting gradients that mean adjacent pixels are rarely identical even within what looks like a uniform color area. JPEG compression, defined in ISO 10918-1 (1994), uses discrete cosine transforms that introduce subtle color variations throughout an image. A region that appears as a flat, uniform color to the eye may contain dozens of slightly different pixel values when measured numerically.
A good color picker uses a sampling algorithm that averages nearby pixels rather than reading a single value. This is why color picker results can vary slightly between implementations and why sampling a small area from a compressed JPEG produces different numbers than sampling the same color from an uncompressed PNG.
Display Calibration and Why Colors Differ Between Screens
A screen's actual color output depends on its calibration state. Two monitors displaying the same HEX value may show noticeably different colors if they have different color gamuts, brightness settings, or color profiles. This is why professional photographers, colorists, and designers use hardware colorimeters to calibrate their displays to a reference standard before doing color-critical work.
The sRGB color profile defines the target that most consumer content is authored for. A display accurately calibrated to sRGB shows sRGB content as intended. Wide-gamut displays, such as those using the DCI-P3 color space adopted by Apple for its Retina displays beginning in 2015, can reproduce colors beyond sRGB. When displaying sRGB content on a wide-gamut screen without proper color management, the operating system or application must map sRGB values into the wider gamut. Without that mapping, colors appear oversaturated.
The X-Rite i1Display Pro and similar colorimeters work by placing a sensor directly on the screen and measuring the actual light output compared to target values, then generating an ICC profile that corrects the discrepancy. Without calibration, a display's white point, gamma curve, and color primaries drift based on manufacturing variation, temperature, and aging backlight components.
When you sample a color from an image on an uncalibrated display, the number you read reflects the display's shifted representation of the color rather than the color as the image file encodes it. For design work that needs to be reproduced consistently across multiple screens, display calibration and proper color profile management matter before the color picker result is trusted.
The Physics of Color Sampling From Photography
Photographs present additional complexity. A RAW image file from a digital camera records the actual light sensor data before any color transformation. A JPEG or processed image has passed through a color space conversion from the camera's native color space (typically wider than sRGB) to the output color space. The colors in a processed photograph are therefore coordinates in a specific output color space, usually sRGB for consumer images or Adobe RGB for professional work.
When sampling a color from a product photograph to reproduce in a website design, the sampled values represent the color as captured and processed under the lighting conditions, camera sensor characteristics, and post-processing settings of that specific image. If the original product has a Pantone color specification, the sampled RGB values from a photograph of it are an approximation influenced by all those variables, not a direct measurement of the pigment color.
This is a practical reason why industrial color matching uses spectrophotometers rather than cameras: a spectrophotometer measures the actual spectral reflectance of a surface across many wavelength bands, producing a measurement that is independent of the illuminant and the observer's display. For most design purposes, pixel sampling from a well-prepared image is precise enough. For product color QA that needs to match a physical standard, it is not.
When Exact Values Matter
The practical need for color picking from images arises in several recurring situations. A developer implementing a design system needs to match the exact colors from a mockup or visual specification. A graphic designer working with a client's existing materials needs to extract the brand colors used in older assets that have no accompanying color documentation. A content creator building a presentation wants to use the exact colors from a reference photograph or brand image.
Eyeballing color values introduces inconsistency that compounds across a project. A small difference in the red channel between a button and the background behind it can create an unintentional visual relationship that the designer did not intend. Across a design system with dozens of components, inconsistent color values cause the kind of small visual discrepancies that read as unprofessional without the viewer being able to identify exactly what is wrong.
The alternative to sampling is entering values manually from a specification document. When no specification exists, when the source is a screenshot rather than a design file, or when the original design tool is not available, sampling from the image is the only way to get an exact value rather than a close approximation.
Conclusion
Color in software is coordinates. Color to the human eye is experience. The color picker translates between them by reading the pixel values the display is actually rendering and expressing them in whatever format a design or development workflow needs. ToolHQ's color picker from image processes your uploaded photo and returns the HEX, RGB, and HSL values for any pixel you select, making it straightforward to extract any color from any visual reference and carry it into your code or design tool with precision.
Frequently Asked Questions
Why does the same HEX color look different on different screens?
Screen calibration, color gamut, brightness settings, and color profiles all affect how a display renders a specific HEX value. Two uncalibrated monitors may show the same color differently even with identical numeric values.
Why does my color picker return a slightly different value than expected?
Images contain compression artifacts and noise that make adjacent pixels slightly different. Most color pickers sample a small area and average the values, which can produce a result that differs slightly from any single pixel.
What is the difference between HEX, RGB, and HSL color formats?
All three represent colors in the sRGB space. HEX and RGB express the same red, green, blue channel values in different notation. HSL expresses the same color as hue, saturation, and lightness, which is often more intuitive for adjusting colors.
How many colors can a standard monitor display?
A standard 24-bit display with 8 bits per channel can display 256 to the power of 3, approximately 16.7 million distinct color values. Higher-bit displays can represent more, though the human eye distinguishes roughly 10 million.