---
layout: single
property_name: mix-blend-mode
---
Defines how the element should blend with the background.
The element does not blend.
The element uses the multiply blend mode.
The element uses the screen blend mode.
The element uses the overlay blend mode.
The element uses the darken blend mode.
The element uses the lighten blend mode.
The element uses the color-dodge blend mode.
The element uses the color-burn blend mode.
The element uses the hard-light blend mode.
The element uses the soft-light blend mode.
The element uses the difference blend mode.
The element uses the exclusion blend mode.
The element uses the hue blend mode.
The element uses the saturation blend mode.
The element uses the color blend mode.
The element uses the luminosity blend mode.
#mix-blend-mode
default
mix-blend-mode: normal;
mix-blend-mode: multiply;
mix-blend-mode: screen;
mix-blend-mode: overlay;
mix-blend-mode: darken;
mix-blend-mode: lighten;
mix-blend-mode: color-dodge;
mix-blend-mode: color-burn;
mix-blend-mode: hard-light;
mix-blend-mode: soft-light;
mix-blend-mode: difference;
mix-blend-mode: exclusion;
mix-blend-mode: hue;
mix-blend-mode: saturation;
mix-blend-mode: color;
mix-blend-mode: luminosity;