Tailwind CSS - from skeptic to practiced

Published 5/18/2020

Tailwind CSS is an amazing framework for CSS but when people first see this:

<div class="sm:flex bg-white bg-gray-200 rounded-lg p-6">
    <img class="h-16 w-16 sm:h-24 sm:w-24 rounded-full mx-auto sm:mx-0 sm:mr-6" src="https://via.placeholder.com/150">
    <div class="text-center sm:text-left">
      <h2 class="text-lg">Erin Lindford</h2>
      <div class="text-purple-500">Customer Support</div>
      <div class="text-gray-600">[email protected]</div>
      <div class="text-gray-600">(555) 765-4321</div>

Well, ... It looks horrendous, doesn't it?

Turns out it comes with a ton of great benefits and once you try it, it's hard to go back.

But you don't have to do it alone, I've created an interactive tutorial to walk you through the benefits, let you play with it and feel the productivity.

You can check it out here. Tailwind isn't hard, in fact, the tutorial is less than 20 slides!

So if you are skeptical about Tailwind, or want to find out why it has gotten this popular, please take a look ;)