Tailwind Crash Course - Project Based Learning

Introduction to TailwindCSS

What is Tailwind

If you are not familiar with Tailwind Framework, It is rapidly growing utility first css framework that has taken everybody by stone

Let's go ahead and explore all the features during this course. But let’s start with some basics.


  • It is Utility-first CSS framework (meaning that instead of having pre-made components, you actually have all the building blocks to make components).
  • It allows you to RAPIDLY BUILD CUSTOM DESIGNS (that don’t actually look like a framework but rather they are 100% custom).
  • It is LOW-LEVEL FRAMEWORK (unlike I mentioned, there are no pre-built components).
  • It give you all of the  (BUILDING BLOCKS, but FULL CREATIVE FREEDOM).
  • And it is HIGHLY CUSOTMIZABLE (though the customisation of Tailwind CSS are outside the scope of this course)


  • It’s Minimal custom CSS (if ever). In sometimes, you may not need custom CSS at all. You may be familiar with the Huge CSS file that you have to go back to make some changes to some projects. Tailwind fixes that issue
  • Easy design changes from the view files. (Now it is easy to make any design changes right from your view files. You don’t have to goto an external CSS file to make some changes, then may be recompile and put it back on to your server. Everything is Done from the View File.
  • And it does give you BETTER DEVELOPER EXPERIENCE because of this.
  • It is MOBILE-FIRST DESIGN FROM THE START. Every modern application should definitely start from Mobile-first.
  • Lastly, It gives you A “POLISHED” AND “DESIGNED” LOOK AND FEEL 🤩.