Why Tailwind Won Me Over

I was a Tailwind skeptic. “Utility classes are ugly,” I said. “It’s just inline styles,” I argued.

Then I actually used it. I was wrong.

The Initial Resistance

My complaints were typical:

• “Classes are too long”
• “HTML looks messy”
• “I already know CSS”

Sound familiar?

What Changed My Mind

Speed

I went from spending 30% of my time on CSS to maybe 5%. The mental overhead of naming classes, organizing stylesheets, and fighting specificity just… vanished.

Consistency

Design systems become automatic. When you use p-4 everywhere, spacing is consistent. No more “is this 16px or 18px?”

Maintenance

Deleting a component? Just delete it. No orphaned CSS to hunt down.

The “Ugly HTML” Argument

Yes, this looks busy:

<button class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">
  Click me
</button>

But you know what? I can read it top to bottom and understand exactly what it does. No jumping between files.

Tips for Getting Started

1. Install the VS Code extension — IntelliSense is essential
2. Learn the spacing scale — 4 = 1rem, 2 = 0.5rem, etc.
3. Use @apply sparingly — It defeats the purpose
4. Embrace the verbosity — It’s a feature, not a bug

---

Tailwind isn’t for every project, but for rapid development? Nothing comes close.