Blog Post

Blending Zombies in the Face

Blend modes can add depth and interest to your work (they can also help you create complex imagery directly in the website). You can use background-blend mode to blend an element’s contents with its background-color, while mix-blend-mode mixes an element with the elements below/behind it. Possible blend modes include multiply, screen, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, hue, saturation, color, and luminosity. (For an in depth look at how each of these blend modes work, check out Advanced CSS: Zombie in a Ballgown)