Wide gamut (Display P3)
A bigger box of screen colors than sRGB can hold; Display P3 is the common one, and its extra reach shows most in reds, oranges, and greens.
See it
What it is
A wide-gamut display can reproduce colors beyond the smaller sRGB triangle. Display P3 is the version web designers meet most often: it borrows the wider P3 primaries from the DCI-P3 digital cinema standard, then pairs them with a D65 white point and the sRGB transfer curve. Its extra reach is especially noticeable in strong reds, oranges, and greens.
Apple pushed Display P3 into everyday design work with the 2015 Retina iMac and later the iPhone 7. On the web, CSS can name P3 colors with color(display-p3 r g b), while the color-gamut media feature lets a page offer them only to capable displays. Keep an sRGB fallback first for screens and software that cannot show the wider version.
Gotcha: P3 does not make every color stronger. A color already inside sRGB looks the same when managed correctly, and the extra colors appear only when the display, browser, file profile, and operating system all preserve them. An untagged export or an sRGB screenshot can quietly collapse the result back into the smaller range.
Ask AI for it
Add a progressive Display P3 palette to this interface. Declare an sRGB hex fallback first, then override it with CSS color(display-p3 r g b) inside @media (color-gamut: p3). Choose at least three P3 swatches that sit measurably outside sRGB, provide an OKLCH value for each, and gamut-map every fallback by reducing chroma rather than clipping RGB channels. Include a side-by-side swatch test and label colors that look identical on an sRGB display.