- Less Basic Tutorial
- Less - Home
- Less - Overview
- Less - Installation
- Language Features
- Less - Nested Rules
- Less - Nested Directives and Bubbling
- Less - Operations
- Less - Escaping
- Less - Functions
- Less - Namespaces and Accessors
- Less - Scope
- Less - Comments
- Less - Importing
- Less - Variables
- Less - Extend
- Less - Mixins
- Less - Parametric Mixins
- Less - Mixins as Functions
- Less - Passing Rulesets to Mixins
- Less - Import Directives
- Less - Import Options
- Less - Mixin Guards
- Less - CSS Guards
- Less - Loops
- Less - Merge
- Less - Parent Selectors
- Functions
- Less - Misc Functions
- Less - String Functions
- Less - List Functions
- Less - Math Functions
- Less - Type Functions
- Less - Color Defination Functions
- Less - Color Channel Functions
- Less - Color Operation
- Less - Color Blending Functions
- Usage
- Less - Command Line Usage
- Using Less In The Browser
- Less - Browser support
- Less - Plugins
- Less - Programmatic Usage
- Less - Online Compilers
- Less - GUIs
- Less - Editors and Plugins
- Less - Third Party Compilers
- Less - Frameworks
- Less Useful Resources
- Less - Quick Guide
- Less - Useful Resources
- Less - Discussion
LESS - Color Blending Functions
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. |