How is sRGB converted to Display P3?

The sRGB channels are first linearized by undoing the sRGB transfer curve. Those linear values are multiplied by an sRGB-to-XYZ matrix, then by an XYZ-to-linear-P3 matrix. Finally the P3 transfer curve (the same gamma as sRGB) is reapplied to get encoded P3 components.

Will the converted color look different?

For colors that exist in sRGB, the P3 value is computed to look the same on a calibrated wide-gamut screen — that is the whole point. Display P3 simply gives access to more saturated colors that sRGB cannot reach at all.

Why are P3 components written from 0 to 1?

The CSS color(display-p3 r g b) function expects floating-point components in the 0–1 range rather than 0–255 integers. This tool outputs that format directly so it is ready to paste into a stylesheet.

Do sRGB and Display P3 share the same gamma curve?

Yes. Display P3 uses the same transfer function (gamma) as sRGB; only the primaries and white-point handling differ. That is why the conversion is mainly a linear matrix transform between linear-light spaces.

Is my color data uploaded anywhere?

No. All matrix math runs entirely in your browser and nothing is sent to a server.

sRGB to Display P3 Converter

The sRGB to Display P3 converter translates standard web colors into the wide-gamut Display P3 space used by modern Apple and other high-end screens. It produces a CSS color(display-p3 r g b) value that renders identically on calibrated P3 displays while sRGB screens fall back gracefully.

How it works

sRGB and Display P3 share the same transfer curve but use different primaries, so converting between them is a matrix transform in linear light:

Linearize each sRGB channel by inverting the sRGB gamma curve (the piecewise function with the 0.04045 threshold).
sRGB → XYZ: multiply the linear sRGB vector by the standard sRGB-to-XYZ matrix.
XYZ → linear P3: multiply by the XYZ-to-linear-Display-P3 matrix.
Re-encode each linear P3 channel with the P3 transfer curve (same gamma as sRGB) to get the final 0–1 components.

The result is the precise Display P3 representation of your input color.

Notes

Components are emitted in the 0–1 range that color(display-p3 ...) expects, not 0–255.
Because every sRGB color fits inside the P3 gamut, the conversion never clips for valid sRGB input.
The benefit of P3 is the extra saturated colors it can reach; converting an existing sRGB color simply re-expresses the same appearance.

All calculations run locally in your browser — nothing is uploaded.