CSS Animation Weekly #336

Twisty 3D text, SSSVG, and more

Donovan at CSSAnimation.rocks
January 23, 2023

An exciting week! I'm trying out a new email platform, and in the CSS world we're having fun with 3D typography, delving into SVG, and learning some head-melting interpolation!

❤️ Donovan at CSSAnimation.rocks

Cool Stuff

Rotating Twister 3D Typography with Three.js

Explore how to twist and rotate text in 3D using Three.js and Shader magic

SSSVG

You can learn how SVG works! Learn how to create and style awesome SVGs in this interactive guide

Interpolation and Animation

A great guide to learning how to combine Bézier curves with interpolation for some complicated-looking animations (Editor: lots of demos, thankfully, as the math was a little over my head)

Inspiration

GSAP CodePens 2022

Scroll through the best of 2022's GSAP animations on this beautifully presented roundup

3D Walkman CSS

Did you know Sony were launching a new Walkman this year? I'm stoked, but while I wait for mine, here's an amazing retro Walkman created and animated with CSS

3D Card

A great hover effect where a semi-transparent layer animated on top of a 3D rotated card

That's all for this week!

Bonus awesomeness

This week I'm trying a new platform which includes an interesting referral program. I've set up some rewards, including stickers and free entry into my course. Try it out!