Identical numbers look different across gamuts
Aliases: display gamut · Display P3 · sRGB · wide-gamut
What it is
A designer locks a teal #00C2A8 on a wide-gamut panel. Engineering opens the same file on an ordinary sRGB display and the teal looks grey and dull. Both sides are reading the same triplet. A gamut is the volume enclosed by a set of primaries plus a white point; the numbers are coordinates inside that volume, not an absolute surface colour. Change the primaries, and the same coordinates name a different colour.
Why it happens
Three channel values become CIE XYZ only after they are multiplied by a primary matrix and referred to a white point. Display P3’s green primary is more saturated than sRGB’s, so (0, 0.76, 0.66) is an electric green in P3 and a modest teal in sRGB. If the file carries no ICC profile and the OS assumes the wrong space, the screen reconstructs the colour with another matrix — it looks as if the file is broken.
Sending a large gamut into a smaller one also requires gamut mapping. Clipping pins out-of-gamut colours to the boundary, so several high-chroma brand stops collapse to one value. Compression squeezes the whole chroma range inward, shifting even colours that already lived inside sRGB. When “the same hex” fails to match across two devices, calibration is often not the culprit; the volumes the coordinates belong to were never the same.
Studying it
Measure XYZ / Lab* of the same coordinates with a spectrophotometer or a calibrated colorimeter on a profiled display, then compare against the space the mockup declared. Independent variables: source and destination gamuts, rendering intent (colorimetric / perceptual / saturation), presence of a profile. Dependent variables: colour difference, fraction of swatches clipped, whether observers still recognise the brand colour.
Interface comparisons need a P3 device and a forced-sRGB window. An eyedropper on the current monitor reads framebuffer integers, not photons.
Where it stops holding
- Two calibrated sRGB displays should be close; this claim is about crossing gamuts, not about calibration error.
- Print is CMYK plus paper white — a larger mismatch than panel-to-panel, and “it matches on screen” is not a proof.
- If the user turns wide-gamut off, or the browser skips colour management, P3 assets are painted as sRGB and look dull. That is a broken management chain, not a change in gamut volume.
- HDR adds a peak-luminance ceiling; what overflows is brightness, not only xy chromaticity.
Applying it
- Tag working gamut on design files and exports. Treat an unprofiled hex table as a cross-device contract and it will fail.
- View the brand primary at least once in sRGB and once in the target wide gamut. If the P3 choice clips in sRGB, pick a reproducible primary inside the smaller volume rather than hoping the device will “make it nicer”.
- Compare screenshots inside the same gamut window, or the argument is about the display, not the design.
- How to check: make profiled swatches of the key colours and view or measure them side by side on an sRGB panel and a P3 panel; note which colours pin to the boundary.