Happy Monday! This week we're exploring CSS blend modes, and playing with fun shading effects!

❤️ Donovan at CSSAnimation.rocks

Background Shift Animation with CSS Blend Modes — tympanus.net

Scroll to experience this background color shift transition using CSS Blend Modes and a multi-layer animation.

clay.css — codeadrian.github.io

This looks fun! A Micro CSS utility and SASS mixin for easily adding inflated fluffy 3d claymorphism styles to any HTML element.

Inspiration

CSS 3D Donut 🍩

This 3D donut, made with 100 divs and styled with CSS includes rotation, shading and more

The Lonely Claw (#CSS)

A gorgeous example of what can be achieved in pure HTML and CSS

csStickman

An awesome example of pure HTML and CSS keyframe animation

CSS Stretchy Heading

Don't stress, stretch!

wordle 300 animation

What's going on

Based on Moirémotion by TAKAHIRO KURASHIMA-san

Not actually animation but kind of looks like it! Move the rectangle around (slowly) to create a moiré effect