Skip to content

Instantly share code, notes, and snippets.

@svgeesus
Last active June 22, 2022 13:32
Show Gist options
  • Save svgeesus/1ae7f34724b0d5e7ca99f217d52446d5 to your computer and use it in GitHub Desktop.
Save svgeesus/1ae7f34724b0d5e7ca99f217d52446d5 to your computer and use it in GitHub Desktop.

Abrupt hue and lightness discontinuities on OKLCH gamut mapping

(All colors here are outside the spectral locus)

let colorALAB = new Color('lab(50%, -127, -127)');
let colorAOKLCH = colorALAB.to('oklch');
let colorA = new Color('oklch(42.2% 1.95 191)');
let colorB = colorA.toGamut({method: 'oklch.c', space: 'srgb'});
let colorC = colorB.to('srgb');

let colorA2LAB = new Color('lab(50%, 0, 127)');
let colorA2OKLCH = colorA2LAB.to('oklch');
let colorA2 = new Color('oklch(56.4% 0.19 102)');
let colorB2 = colorA2.toGamut({method: 'oklch.c', space: 'srgb'});
let colorC2 = colorB2.to('srgb');

let colorA3LAB = new Color('lab(50%, 127, 127)');
let colorA3OKLCH = colorA3LAB.to('oklch');
let colorA3 = new Color('oklch(60.7% 0.39 22.9)');
let colorB3 = colorA3.toGamut({method: 'oklch.c', space: 'srgb'});
let colorC3 = colorB3.to('srgb');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment