LESS - Color Blending Functions

Advertisements

Previous Page
Next Page  

In this chapter, we will understand the Color Blending Functions in LESS. These are similar operations used in image editors like Photoshop, Fireworks or GIMP, which matches your CSS colors to your images.

The following table shows the color blending functions used in LESS.

Sr.No. Functions & Description
1 multiply

It multiplies two colors and returns a resultant color.
2 screen

It takes two colors and returns a brighter color. It works opposite of multiply function.
3 overlay

It generates result by combining the effect of multiply and screen.
4 softlight

It works similar to overlay but it uses only a part of the color, which soft-highlights the other color.
5 hardlight

It works similar to overlay but the role of the colors reversed.
6 difference

It subtracts the second input color from the first input color.
7 exclusion

It works similar to difference function but with lower contrast.
8 average

It computes the average of two input colors on a per-channel (RGB) basis.
9 negation

It works opposite to difference function, which subtracts first color from second color.
Advertisements