- CSS Animation Weekly
- Posts
- CSS Animation Weekly #299
CSS Animation Weekly #299
This week we're - wait, what day is it? My apologies, this newsletter is a few days late! Enjoy an extra jam-packed newsletter with tutorials on creating 3D cars, typing effects, lines to layout animations and more.
❤️ Donovan at CSSAnimation.rocks
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/4502272e-f261-4d7a-b3ac-03611ec314af/hqdefault.jpg)
A great Youtube tutorial on using React Fibre to create a realistic 3D car scene with post-processing effects
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/41441391-2236-4fcb-9942-ef56db4fd1e2/main.jpeg)
A hook that backspaces and types out an array of words. Handy for product landing pages!
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/542a5fb4-72f0-4047-8a0b-78c32133bd67/lines2layout_featured.jpg)
Selecting an image expands nicely to set up the content page in this demo from Codrops
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/196d78d3-9852-4702-963d-4f1fef93206e/threejs-andy-bolierplate.png)
One to bookmark for future 3D web projects!
![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/742c4027-7572-43df-8291-5cb0ecfa637b/share-image-loaders-b1368c356a04a14fddc337ace8fda1da.png)
Free loaders & spinners for your next project. Built with HTML, CSS and a soupçon of SVG!
Inspiration
I like the use of blur as these letters appear and disappear
Retro-style animation using just CSS
A standing ovation for this link hover effect
Not strictly animation but a cool effect to check out using blend modes to create a flashlight-style cursor