liveBook · Manning

Wide gamut color space

As explained in CSS in Depth, Second Edition

A wide gamut color space represents a range of colors broader than the standard sRGB gamut.

A wide gamut color space lets CSS specify colors beyond the standard sRGB range. LAB, LCH, OKLAB, and OKLCH can represent colors across the range visible to the human eye, even when a display cannot reproduce the chosen color. section 11.2.2

A P3 color on an sRGB display

A color specified for a P3 display can still be used on a display limited to sRGB. The browser rounds it to the closest available representation, usually giving an acceptable fallback when the values stay within their expected range. section 11.2.2

These notations also aim for perceptually consistent lightness and vividness. Equal lightness values in HSL can make green look brighter than blue; the newer notations are designed to balance that difference. Prefer OKLAB or OKLCH over LAB or LCH, whose specifications have inconsistencies affecting some blues and purples. section 11.2.2

How CSS in Depth, Second Edition covers it

How deep it goes
Explains gamut limits, display rounding, and perceptual consistency, but does not give wide-gamut notation syntax in the supplied excerpt.
Examples
Contrasts equal-lightness HSL greens and blues and describes a P3 color approximated on an sRGB display.
What you can do after
Apply it via CSS OKLAB or OKLCH when choosing wide-gamut colors that need display-dependent approximations.
How it connects
Connects wide-gamut color to sRGB, P3, HSL, LAB, LCH, OKLAB, and OKLCH.
Cover of CSS in Depth, Second Edition
liveBookmanning.com
Read CSS in Depth, Second Edition on liveBook Get the book at manning.com

This explainer was generated by Manning's knowledge graph from the text of CSS in Depth, Second Edition. The section links point to the parts of the book it draws on.