# 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:

- Safari 10+ (macOS and iOS)
- Chrome 111+
- Firefox 113+
- Edge 111+

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