Wide-gamut (Display P3) support 🎨
Color Thief can now read and report wide-gamut colors, fixing incorrect results on P3-tagged images where out-of-sRGB colors were collapsed down to sRGB (thanks @LeaVerou — #266).
New gamut option
Opt in per call (or via configure): 'srgb' (default), 'display-p3', or 'auto'.
const palette = await getPalette(img, { gamut: 'display-p3' });
palette[0].css(); // 'color(display-p3 …)'
palette[0].gamut; // 'display-p3'
// 'auto' upgrades to P3 only when the image actually uses out-of-sRGB colors
const auto = await getPalette(img, { gamut: 'auto' });What changed
- Browser loaders read the image through a P3 canvas (
getContext('2d', { colorSpace: 'display-p3' })) with feature detection and automatic sRGB fallback. - Gamut-aware OKLCH quantization preserves the extra saturation instead of clamping it away.
- Color objects now carry
.gamut..css()emitscolor(display-p3 …)and.oklch()reports the true wider chroma, while.rgb()/.array()/.hex()stay sRGB (gamut-mapped) so existing consumers keep working. Use.rgb('display-p3')for raw P3 components. - Threaded through the async, sync, worker, and progressive paths.
Notes
- Backward compatible — default behavior is unchanged sRGB.
- Node output is sRGB for now; P3 there is tracked as a follow-up.
Full changelog: v3.3.2...v3.4.0