Rotating Text

If you haven't toggled the "Prefers Reduced Motion" setting and you're navigating this site on a non-touch device, you might have noticed the hover animation on the buttons that open and close the menu. It's a 3D rotating animation where each letter rotates forward – one after the other.

This is actually a component I built for my 2022 portfolio and ended up reusing on my current site. I've also open-sourced and published it as an npm package for public usage!

You can visit the GitHub repo here – or check out the demo playground I've created to explore how you can control the animation behavior.