Why 2D slices, not a 3D model
A rotatable 3D gamut looks impressive but is hard to read and inaccessible — you can’t key it, screen-reader it, or compare regions without spinning. Two flat slices (chroma vs lightness, chroma vs hue) show the axis relationships you actually reason about, side by side, with a plain worded answer up top. It’s lighter, keyboard-operable, and works for everyone.
Computed in OKLCH
Boundaries come from testing gamut membership in the proper RGB space and finding the maximum displayable chroma per lightness and hue — never by clipping RGB channels. The fallback shown for out-of-gamut colors reduces chroma while preserving lightness and hue, matching the rest of these tools.
Frequently asked questions
What is a color gamut?
A gamut is the range of colors a display can actually show. sRGB is the long-standing baseline that virtually every screen covers. Display-P3 is a wider gamut (≈25% larger) on most recent phones, laptops, and monitors. Rec. 2020 is wider still, targeted by HDR — but few displays cover it yet.
How do I read the two charts?
Each line is a gamut's boundary envelope — roughly the most chroma that gamut shows at each point. The top chart sweeps lightness at your current hue; the bottom sweeps the hue circle at your current lightness. sRGB is the solid line, Display-P3 dashed, Rec. 2020 dotted. The dot is your color; it usually sits inside its gamut's line, but at the deep non-convex corners it can poke just outside — so for the actual verdict, trust the worded answer and the fit table.
Why is my color “outside sRGB”?
Because its chroma is higher than sRGB can reproduce at that lightness and hue — common for vivid greens, cyans, and oranges. A Display-P3 screen can show it; on an sRGB screen it falls back to the nearest displayable color (the chroma-clamped hex shown next to the answer).
How accurate are the boundaries?
Membership — the headline answer of which gamut your color fits in — is computed directly and is authoritative. The drawn boundary lines trace the smooth OKLCH envelope; because OKLCH is non-convex at the deep blue and magenta corners, the pure primaries there are singular spikes that poke just past the line, so a very saturated blue marker can sit a hair outside the sRGB curve even though it is sRGB. Trust the worded answer for membership.
Is my color sent anywhere?
No. Everything is computed in your browser from the OKLCH gamut math. Your color is encoded in the URL so you can share a result, but nothing is uploaded.
Related tools
References
This tool’s color math is grounded in the following standards and primary sources.
- CSS Color 4 — predefined color spaces (display-p3, rec2020) — W3C — wide-gamut color definitions
- Recommendation ITU-R BT.2020 — ITU — the Rec. 2020 ultra-wide gamut
- A perceptual color space for image processing (OKLab / OKLCH) — Björn Ottosson, 2020
- culori — color library — Dan Burzo (MIT)
Spotted an error? Let us know — reader corrections are the best review this site gets.