CSS Animation Weekly #41 - Web Animations vs CSS Animation

This week we're learning how the Web Animation API compares to CSS keyframe animations, and sharing s
CSS Animation Weekly #41 - Web Animations vs CSS Animation
By CSS Animation Weekly • Issue #41
This week we’re learning how the Web Animation API compares to CSS keyframe animations, and sharing some amazing examples of CSS and JavaScript animation.
♥️
Donovan at CSSAnimation.rocks 

Articles
CSS Animations vs the Web Animations API: A Case Study
Ever wondered how the Web Animations API compares to CSS animations? This article nicely explains and demonstrates how to create animations using both keyframes and JavaScript.
Featured
Level Up your CSS animation skills
Guess what? I’m working on a course to help you apply your CSS animation knowledge to real-world examples. Join me, join a like-minded Slack community and be part of it.
As a CSS Animation Weekly reader, you can save 10% on the course. (Use discount code weekly01)
Inspiration
“Animations for the strong of heart, and weak of mind” 🙀
Very slick work here from Peter Barr - a Tweenmax-based burger navigation button 🍔
codepen.io  •  Share
Another incredible demo from Ana Tudor with overlapping triangles and CSS filters. Watch how it was coded on Youtube ▶︎
codepen.io  •  Share
Hilarious example of a bulge and pinch filter creating using PixiJS
codepen.io  •  Share
Click anywhere to place a pixel in this 3D rotating demo
codepen.io  •  Share
Sarah Drasner shows how to use animated SVGs within React in this gorgeous demo. Press “Read more” to see the animations.
codepen.io  •  Share
Great use of CSS’s “steps” timing function with the image sprite in this video game demo.
codepen.io  •  Share
Animation in the real world
Storytrail
From the first moment the loading animation appears, this site makes great use of movement. Go through and see the onboarding. 
Did you enjoy this issue?
CSS Animation Weekly
CSS Animation Weekly is a roundup of all the latest CSS animation articles and inspiration. Subscribe now and never miss an issue.
Carefully curated by CSS Animation Weekly with Revue. If you were forwarded this newsletter and you like it, you can subscribe here. If you don't want these updates anymore, please unsubscribe here.