The Advanced TailwindCSS Crash Course

Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ https://www.hover.dev TailwindCSS is, in my opinion, the simplest, easiest to maintain, most scalable way to handle styling. Today we're not only going to learn the basics (you can learn those in about 5 minutes on your own), but all of the advanced tips I've picked up over a few years using Tailwind. If there's anything I haven't covered in this video that you'd like me to cover, please don't hesitate to ask! I'm happy to do more break downs! 📚 Project Links Code: https://github.com/TomIsLoading/advanced-tailwindcss-crash-course Better theming: https://www.youtube.com/watch?v=vIBKSmWAdIA Why people love Tailwind: https://www.youtube.com/watch?v=Bu1tYaHtaEo Install: https://tailwindcss.com/docs/installation tailwind-merge: https://github.com/dcastil/tailwind-merge class-variance-authority: https://cva.style/docs 🔗 My Links TikTok: https://www.tiktok.com/@tomisloading Instagram: https://www.instagram.com/tomisloading/ GitHub: https://github.com/TomIsLoading Twitter: https://twitter.com/TomIsLoading Discord & more: https://linktr.ee/tomisloading Portfolio templates: https://tomisloading.gumroad.com/ Website: https://www.hover.dev Timeline: 0:00 - Introduction 0:23 - What is is and why you should use it 5:17 - Installation 6:14 - My TailwindCSS & React component library 6:59 - VSCode and prettier plugins 8:27 - The basics 12:26 - Modifiers 16:57 - Dark mode 19:22 - Responsiveness 21:11 - Extra tailwind magic utilities 25:03 - Theming 28:14 - Directives 29:50 - Plugins 33:03 - Tooling