Two not newly (2014) introduces blending modes (background-blend-mode and mix-blend-mode) have been promoted by Adobe Web Platform team. It means that they use the same principles and algorithms as old-fashioned Photoshop. With mix-blend-mode, we define the blending between the element and the element(s) that are behind it. With background-blend-mode, we define the blending between the element’s background image and its background color. You can use this modes with 16 different properties — this will give you all the instruments to manipulate layers. By the way, you don’t need to memorize math formulas to use blending modes, but it’s worth having a basic understanding of how blending works under the hood.
There are 16 blend modes available in CSS:
normal (which is the default blend mode and means that no blending is applied),
Blend modes can be really useful when you want to achieve special effects like this: