Color Gamut Test — P3 vs sRGB Boundary

sRGB reference
P3 wide gamut
Media Query Detection
✗ sRGB only✗ No Rec.2020

Different columns = wide gamut; identical = sRGB panel (or browser P3 off)

Features

Professional Gamut Inspection

A professional gamut test: six P3 ultra-saturated patches beside sRGB references, with automatic media-query detection — see instantly whether your display supports wide gamut.

Side-by-Side Saturation

Six patch pairs, sRGB left and P3 right — wide-gamut panels show a vividly richer right column.

Auto Capability Check

The color-gamut media query reports browser-level P3 / Rec.2020 support automatically.

CSS-Level Verification

Native color(display-p3) values verify the whole chain: browser, OS and panel.

Concepts

The Gamut Family

sRGB

Standard Gamut

The internet default covering ~35% of visible colors — the “safe” space for all content.

DCI-P3

Wide Gamut

Cinema standard, ~25% larger than sRGB with richer reds and greens. The Apple and HDR de facto standard.

Rec.2020 / Adobe RGB

Pro Gamuts

Rec.2020 covers ~75% of visible color (UHDTV); Adobe RGB extends cyans/greens for print work.

How to

Three Steps to Identify Gamut

01

Read the Report

The page auto-reads media queries — a P3 checkmark means the browser chain supports wide gamut.

02

Compare Columns

Fullscreen the six pairs: a richer right column = wide gamut active; identical columns = sRGB output.

03

Triple-Check RGB

Red/green/blue pairs show the biggest gaps — wide-gamut reds are fierier, greens more emerald.

Compare

Four Gamut Coverages

sRGB

~35%
  • · Internet default
  • · Every device supports
  • · Safest for content
  • · Baseline for pro use

DCI-P3

~45%
  • · Cinema/HDR standard
  • · Apple ecosystem default
  • · Richer reds & greens
  • · Common on flagships

Adobe RGB

~50%
  • · Print industry choice
  • · Wider cyan-green range
  • · Photo post-production
  • · Needs color management

Rec.2020

~75%
  • · UHDTV endgame
  • · No panel fully covers
  • · QD-OLED ~80%+
  • · The future
Tips

Pro Tips

Clamp Wide Gamuts

Viewing sRGB content (99% of the web) on wide-gamut panels needs sRGB mode, or colors oversaturate.

Windows ACM

Windows 11 Auto Color Management greatly improves sRGB rendering on wide-gamut panels — enable it.

Beware 45% NTSC

Budget laptop panels at 45% NTSC ≈ 63% sRGB look washed out — avoid for design work.

Trust Measurements

Nano IPS / QD / QD-OLED gamut volumes differ widely — buy on measured coverage, not marketing.

FAQ

FAQ

Recommended Test Environment

  • Use the latest Chrome/Safari
  • macOS is end-to-end P3 by default
  • Enable ACM on Windows
  • Observe at daily brightness
  • Avoid direct glare on screen
  • Compare beside a second device for clarity
Related

Related Tools

Device Guides

This test maps to the Wizard Step 4 gamut check — run all 8 checks and export a report.
Wizard · Step 4 / 8 — Color Gamut
Open Test Wizard