Learn the basics of Tailwind CSS by building a Discord-inspired navbar from scratch. Learn how to leverage utility classes to build responsive animated UI elements faster https://fireship.io/lessons/tailwind-...
#webdev #css #tutorial
🔗 Resources
Tailwind Docs https://tailwindcss.com/
Tailwind React Setup https://tailwindcss.com/docs/guides/c...
Source Code https://github.com/fireship-io/tailwi...
📚 Chapters
00:00 Intro
00:54 Should you use Tailwind?
01:42 Setup
02:48 JIT Mode
03:20 Functional CSS Basics
04:06 Flexible Container
04:41 Organize UI Components
05:07 Position a Sidebar
06:58 Customize Colors
07:50 Icon Buttons
08:23 Custom Classes with Apply
09:32 Pseudo-class Variants
09:56 Animation
10:34 Groups
11:54 Dark Mode
🔥 Get More Content - Upgrade to PRO
Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.
🎨 My Editor Settings
Atom One Dark
vscode-icons
Fira Code Font
🔖 Topics Covered
Beginner Tailwind Tutorial
Using Tailwind in React
Tailwind Animation
Tailwind Dark Mode
CSS vs Tailwind vs Bootstrap
Watch video Ultimate Tailwind CSS Tutorial // Build a Discord-inspired Animated Navbar online without registration, duration hours minute second in high quality. This video was added by user Fireship 19 October 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,476,219 once and liked it 54 thousand people.