A massive week of tutorials, tools and inspiration!

♥️

Donovan at CSSAnimation.rocks

CSS Layout and Animations

Great lessons on how to prototype with CSS Grid, Flexbox and CSS animations ✨

Zdog — zzz.dog

Round, flat, designer-friendly pseudo-3D engine for canvas and SVG

Scene.js is a JavaScript Animation Library

Check out Scene.js, a powerful library for creating animated websites combining JS and CSS animations

The Future of Web Animation — www.youtube.com

The awesome Sarah Drasner talks about the future of Web animation, and shares lots of great tips and advice along the way

Animation on a circular path — www.youtube.com

An interesting tutorial on how to use a handy tool to create circular keyframe animations and a step by step guide to using them in a banner

Fx Ground — fxground.com

Looking for motion inspiration? You'll find loads here. It's like Dribbble for UI interactions, including hover effects and more

Featured

Level Up Your CSS Animation Skills | Udemy — www.udemy.com

A practical guide to creating amazing CSS animation on the web. Enjoy almost 4 hours of my lovely Northern Irish accent ;)

Inspiration

Infinite Circles - CSS Doodle

Stunning pure-CSS animation in this infinite scrolling piece of art

Zdog Space Scene

Another cool example of 3D using the neat Zdog library

100 days CSS #18

Some interesting flipping-stretching going on here

Shadow (Three.js)

Gorgeous use of shadows in this Three.js demo

CSS-only Animated Lantern

Cute-looking lantern with animated glow and bugs

Don't forget to forward this newsletter to your web designer and developer friends! Share the love.