adjustHwb()

The adjustHwb function allows you to adjust the HWB (Hue, Whiteness, Blackness) values of a color object. This function returns a new Spectrum instance with the updated HWB values.

Usage

import Spectrum, { adjustHwb } from '@snipshot/spectrum';

const color = new Spectrum('hwb', [200, 0.3, 0.25, 1]);

const adjustedColor = adjustHwb(color, {
  hue: -20, // Adjust hue by -20 degrees
  whiteness: '10%', // Increase whiteness by 10%
  blackness: '-5%' // Decrease blackness by 5%
});

console.log(adjustedColor.hwb); // { h: 180, w: 0.4, b: 0.2, a: 1 }
console.log(color.hex === adjustedColor.hex); // false

Parameters

adjustHwb(colorObj, options)

Parameter	Type	Required	Valid range	Description
colorObj	Spectrum instance	true	-	The Spectrum instance representing the color you want to adjust
options.hue	number	false	[-360; 360]	The amount by which to adjust the hue value
options.whiteness	string	false	['-100%'; '100%']	The amount by which to adjust the whiteness value. Should be provided as a percentage string.
options.blackness	string	false	['-100%'; '100%']	The amount by which to adjust the blackness value. Should be provided as a percentage string.
options.alpha	number	false	[-1; 1]	The amount by which to adjust the alpha value

Return Value

The adjustHwb function returns a new Spectrum instance with the adjusted HWB values.

Examples

Adjust all properties

import Spectrum, { adjustHwb } from '@snipshot/spectrum';

const color = new Spectrum('hwb', [200, 0.3, 0.54, 1]);
const adjustedColor = adjustHwb(color, {
  hue: -45,
  whiteness: '30%',
  blackness: '-14%',
  alpha: -0.32
});

console.log(adjustedColor.hwb); // { h: 155, w: 0.6, b: 0.4, a: 0.68 }

Adjust Hue

import Spectrum, { adjustHwb } from '@snipshot/spectrum';

const color = new Spectrum('hsl', [200, 0.3, 0.54, 1]);
const adjustedColor = adjustHwb(color, { hue: -20 });

console.log(adjustedColor.hwb); // { h: 180, w: 0.3, b: 0.54, a: 1 }