You Actually CAN Build Animations with TailwindCSS

Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ www.hover.dev
TailwindCSS includes a couple of animations by default, but what if you want to add more? What if you want to define your own parameters for them, like easing functions and delay? Today we'll learn how
#tailwindcss #programming #webdev
📚 Video Links
Source code: github.com/TomIsLoading/tailw...
TailwindCSS Animate Plugin: github.com/jamiebuilds/tailwi...
🔗 My Links
TikTok: / tomisloading
Instagram: / tomisloading
GitHub: github.com/TomIsLoading
Twitter: / tomisloading
Discord & more: linktr.ee/tomisloading
Portfolio templates: tomisloading.gumroad.com/
0:00 - Introduction
0:56 - Extend Tailwinds basic animations
2:07 - Defining animations inline
2:34 - Creating custom animations
4:00 - Setting animation properties with the tailwindcss animate plugin
7:27 - Play & pause animations

[@hunterash2913]

A hugely underrated channel

[@jannickpedersen4620]

Thanks Tom for making my frontend life more easy but also with more quality. Pro hover for life 💪🔥

[@sumonchandra5992]

Definitely this is one of the best animation tips for tailwindcss. Love you Tom ❤❤

[@liamvickerstaff5994]

Insanely useful to know that you can get so much more out of tailwind, great video

[@tomisloading]

Thanks, happy I can help 😁

[@collinsk8754]

Great tutorial as always! 🔥🔥

[@tomisloading]

Thank you!! 😁

[@syntaxandRender]

Damm such useful info

[@404-not-found-service]

Thanks ❤

[@Agent-zn2gl]

You can actually do duration and delay without using a plug in