Stripe-Inspired Typewriter Animation with React and Framer Motion
Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ https://www.hover.dev
Framer Motion course waitlist ✨ https://www.blast.dev
Well, looks like Stripe has done it again. Their new website for stripe.dev is absolutely filled with awesome interactions and animations.
Today, we're going to break down one of my favorites. A new take on the classic typewriter animation. We'll rebuild this effect with React, TailwindCSS, and Framer Motion.
📚 Project Links
Source code: https://www.hover.dev/components/cards
inspo: https://stripe.dev/
🔗 My Links
TikTok: / tomisloading
Instagram: / tomisloading
GitHub: https://github.com/TomIsLoading
Twitter: / tomisloading
Discord & more: https://linktr.ee/tomisloading
Portfolio templates: https://tomisloading.gumroad.com/
Timeline:
0:00 - Introduction
0:22 - What we're going to build
0:57 - Layout the card
4:37 - Create the typewriter animation