Displays

DCI-P3

A wide color range from digital cinema that most wide gamut monitors, phones and laptops aim for. It shares sRGB's blue but reaches further into red and green. Apple's Display P3 uses the same primaries with a D65 white.

Where DCI-P3 comes from

DCI-P3 started with Digital Cinema Initiatives, the group of film studios that set the rules for digital cinema. SMPTE wrote its reference projector down in RP 431-2. Its primaries on the CIE 1931 xy chart:

  • Red at (0.680, 0.320), deeper than sRGB's (0.640, 0.330).
  • Green at (0.265, 0.690), further out than sRGB's (0.300, 0.600).
  • Blue at (0.150, 0.060), the same as sRGB's.

The cinema version pairs them with a white at (0.314, 0.351), a little toward green, and a 2.6 gamma for a dark room.

DCI-P3, Display P3 and P3 D65

Screens use the same three primaries with a different white and tone curve. Apple's Display P3 uses D65 white, the same as sRGB, and the sRGB curve. Phones, laptops, monitors and CSS use it. P3 D65 keeps that white for film and HDR mastering, usually with a 2.6 gamma or the PQ curve.

Coverage only looks at the primaries, so a 95% DCI-P3 monitor is a 95% Display P3 monitor. The white point matters when you pick a monitor mode, since a true DCI white looks a little green next to everything else on the desk.

What a P3 coverage number tells you

DCI-P3 holds all of sRGB. An exact sRGB triangle covers 73.7% of DCI-P3 in CIE 1931 xy and 79.6% in CIE 1976 u'v'. A screen's P3 number past that point shows how far it reaches beyond sRGB.

HDR video is stored in Rec. 2020 but usually mastered on displays that cover about DCI-P3, so P3 coverage is the color number to read for HDR. VESA's current DisplayHDR test spec asks for 90% of it at DisplayHDR 400 and 95% at every other tier.

P3 on the web

CSS names P3 colors with color(display-p3 1 0 0), and oklch() can reach them too. The color-gamut: p3 media query matches a screen that covers about P3 or more. On an sRGB screen, the browser maps a P3 color to the nearest one the screen can show, so the page still works.

Work it out yourselfOpen the Color Gamut Visualizer

Sources

Back to the glossary