Experiment · color gamut
Out of gamut
A file declares colors in a number space, and the screen declares how wide its own gamut is. Push a color past the boundary of sRGB and the two disagree — one side renders the color the file asked for, the other clamps it to what it has. Same recipe, two results.
The same-different
One recipe, two renderings
Left, the gradient declared in display-p3. Right, the same coordinates declared as sRGB. On a wide-gamut screen the halves diverge; on an sRGB screen they are identical.
At 0% both halves are the same neutral gray — there is nothing outside the gamut to show. As chroma rises, the left half asks for colors whose coordinates exceed sRGB's triangle. The difference you can see, or can't, is your screen's gamut doing its job.
How it works
The triangle and the file
sRGB was designed in 1996 for CRT monitors and covers roughly a third of the colors a modern display can produce. Any color specified in it lives inside one shared triangle, which is what makes the format so dependable — every screen reproduces it the same way. The cost is that the most saturated colors a panel can make have no coordinates in that triangle at all.
display-p3 is a wider triangle, built from the color primaries the film industry chose for digital cinema. The same numeric recipe means different colors in the two spaces: a pure red in p3 is redder than a pure red in sRGB. When you give a screen an out-of-triangle color, the screen decides — a wide-gamut display renders it, an sRGB display clamps it to its own nearest red, and the two files look identical.
This is the same split the HDR page uses for brightness, moved to saturation. The probe below reads the actual pixel buffer on each half; equal values mean the browser's own pipeline clamped the wide color away before it reached the panel.