Functions
h-adjust()
Adjust the hue of a color value.
h-adjust( color, offset )
Parameters
color
Any valid CSS color valueoffset
The percentage to offset the color hue (percent mark optional)
Returns
The modified color value.
color: h-adjust( deepskyblue -10 );
s-adjust()
Adjust the saturation of a color value.
s-adjust( color, offset )
Parameters
color
Any valid CSS color valueoffset
The percentage to offset the color hue (percent mark optional)
Returns
The modified color value.
/* Desaturate */
color: s-adjust( deepskyblue -100 );
l-adjust()
Adjust the lightness of a color value.
l-adjust( color, offset )
Parameters
color
Any valid CSS color valueoffset
The percentage to offset the color hue (percent mark optional)
Returns
The modified color value.
color: l-adjust( deepskyblue 10 );
a-adjust()
Manipulate the opacity (alpha channel) of a color value.
a-adjust( color, offset )
Parameters
color
Any valid CSS color valueoffset
The percentage to offset the color opacity
Returns
The modified color value.
/* Reduce color opacity by 10% */
color: a-adjust( rgb(50,50,0) -10 );
hsl-adjust()
Manipulate the hue, saturation and lightness of a color value
hsl-adjust( color, hue-offset, saturation-offset, lightness-offset )
Parameters
color
Any valid CSS color valuehue-offset
The percentage to offset the color huesaturation-offset
The percentage to offset the color saturationlightness-offset
The percentage to offset the color lightness
Returns
The modified color value.
/* Lighten and increase saturation */
color: hsl-adjust( red 0 5 5 );
hsla-adjust()
Manipulate the hue, saturation, lightness and opacity of a color value.
hsla-adjust( color, hue-offset, saturation-offset, lightness-offset, alpha-offset )
Parameters
color
Any valid CSS color valuehue-offset
The percentage to offset the color huesaturation-offset
The percentage to offset the color saturationlightness-offset
The percentage to offset the color lightnessalpha-offset
The percentage to offset the color opacity
Returns
The modified color value.
color: hsla-adjust( #f00 0 5 5 -10 );