Closed NateBaldwinDesign closed 1 year ago
Adjusting Theme or Color saturation results in unexpected hue shifts. This is especially visible for blues. This is due to the use of HSLuv for deriving new colors with updated saturation levels.
Theme
Color
const color = new Color({ name: 'Color', colorKeys: ['#2451FF', '#C9FEFE', '#012676'], ratios: [3, 4.5], colorspace: 'CAM02' }); const theme = new Theme({ colors: [color], backgroundColor: '#f5f5f5', output: 'RGB', saturation: 60 });
theme.contrastColorValues
60
theme.saturation = 60;
Expect hue to be preserved in appearance.
1.0.0-alpha.16
Description
Adjusting
Theme
orColor
saturation results in unexpected hue shifts. This is especially visible for blues. This is due to the use of HSLuv for deriving new colors with updated saturation levels.Steps to reproduce
theme.contrastColorValues
and paste them into a visual tool like Figma60
by runningtheme.contrastColorValues
and paste them side-by-side in a visual tool like FigmaExpected behavior
Expect hue to be preserved in appearance.
Screenshots
Leonardo package and version
1.0.0-alpha.16
Environment
Additional context