Pierre Theme: Display P3 Color Comparison

Checking Display P3 support...

About Display P3 Enhanced Colors

Display P3 is a wider color gamut that can display ~25% more colors than standard sRGB. The Pierre Vibrant themes use CSS color(display-p3 r g b) format with enhanced saturation to fully utilize the P3 color space.

Enhancement: Colors are boosted by 15-30% saturation (depending on original saturation) and 5% luminance for highly saturated colors. This pushes colors into the wider P3 gamut that isn't available in sRGB.

Important: To see the difference, you need a P3-capable display (most Macs from 2015+, iPhones, iPads).

Blue

Standard (sRGB)
#008cff
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.267653 0.570512 1.000000)

Green

Standard (sRGB)
#0dbe4e
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.298067 0.776115 0.322484)

Red

Standard (sRGB)
#ff2e3f
Vibrant (Display P3 Enhanced)
P3
color(display-p3 1.000000 0.250216 0.262337)

Purple

Standard (sRGB)
#c635e4
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.770871 0.230698 0.945253)

Pink

Standard (sRGB)
#fc2b73
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.995522 0.233444 0.460772)

Orange

Standard (sRGB)
#fe8c2c
Vibrant (Display P3 Enhanced)
P3
color(display-p3 1.000000 0.598672 0.265916)

Cyan

Standard (sRGB)
#08c0ef
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.327292 0.790977 0.995660)

Teal

Standard (sRGB)
#00c5d2
Vibrant (Display P3 Enhanced)
P3
color(display-p3 0.342284 0.816699 0.877157)

Browser Support

CSS color(display-p3 ...) is supported in:

Browsers without P3 support will automatically fall back to the closest sRGB color.