Curated articles for designers and front-end developers

CSS Blend Modes

Frequently updated collection of hand-picked articles and learning resources.

bennettfeely.com

Image Effects with CSS

Using one or more newer CSS properties (background-blend-mode, mix-blend-mode, or filter) gives us a surprising amount of possibilities to manipulate a single source image. Image of lighthouse used for CSS image effects ...

pilot.co

Color Blending in SCSS

One of the conventions in Altimeter, our CSS components library, is how element states like hover and active are made. Instead of inventing new shades for each element, we have a system ...

Udemy sponsored

Mobile App Design from scratch with Sketch 3 : UX and UI

This course is not just about creating a pretty app, it’s about designing an app that works great and happens to be beautiful. We'll teach you a complete design workflow that will allow you turn your idea into a fully designed ...

codepen.io

How Will it Blend?

The CSS property mix-blend-mode controls how an element blends into elements behind it. All 16 blend modes are show below, and apply to the left circle, which overlaps with the right circle ...

alistapart.com

Blending Modes Demystified

Web imagery increasingly tends toward losslessness. When we make changes to a design or graphic, we want to be able to apply them without damaging the source material. That way, the original ...