Less color channel functions are the built-in functions which are used to set value about a channel. The channel sets the value according to the color definition. The HSL colors consist of hue, saturation and lightness channel and the RGB colors consist of red, green and blue channel.

A list of color channel functions:

Index

Function

Description

Example

1)

hue

In hsl color space, the hue channel is extracted of the color object.

background: hue(hsl(80, 90%, 40%)); it compiles in the CSS to show only hue value as: background: 80;

2)

saturation

In hsl color space, the saturation channel is extracted of the color object.

background: saturation(hsl(80, 90%, 40%)); it compiles in the CSS to show only saturation value as: background: 90%;

3)

lightness

In hsl color space, the lightness channel is extracted of the color object.

background: lightness(hsl(80, 90%, 40%)); it compiles in the CSS to show only lightness value as: background: 30%;

4)

hsvhue

In hsv color space, the hue channel is extracted of the color object.

background: hsvhue(hsv(80, 90%, 40%)); it compiles in the CSS to show hue value as: background: 80;

5)

hsvsaturation

In hsl color space, the saturation channel is extracted of the color object.

background: hsvsaturation(hsv(80, 90%, 40%)); it compiles in the CSS to show only saturation value as: background: 90%;

6)

hsvvalue

In hsl color space, the value channel is extracted of the color object.

background: hsvvalue(hsv(80, 90%, 40%)); it compiles in the CSS to show value as: background: 40%;

7)

red

The red channel is extracted of the color object.

background: red(rgb(10, 20, 30)); it compiles in the CSS to show only red value: background: 10;

8)

green

The green channel is extracted of the color object.

background: green(rgb(10, 20, 30)); it compiles in the CSS as shown below:

background: 20;

9)

blue

The blue channel is extracted of the color object.

background: blue(rgb(10, 20, 30)); it compiles in the CSS to show only blue value: background: 30;

10)

alpha

The alpha channel is extracted of the color object.

background: alpha(rgba(5, 15, 25, 1.5)); it compiles in the CSS to show alpha value as: background: 2;

11)

luma

luma value is calculated of a color object.

background: luma(rgb(50, 250, 150)); it compiles in the CSS to show luma value as: background: 71.2513323%;

12)

luminance

The luma value is calculated without gamma correction.

background: luminance(rgb(50, 250, 150)); it compiles in the CSS as shown below: background: 78.53333333%;