Why I Switched to Tailwind CSS

I used to write CSS the "normal" way — BEM naming, separate stylesheets, maybe CSS modules. It worked fine, but switching to Tailwind CSS completely changed my workflow.

The Problem with Traditional CSS

Every time I needed to style something, I had to:

1. Think of a class name
2. Switch to a CSS file
3. Write the styles
4. Switch back to the component

With Tailwind, I just stay in my component and write styles inline. No context switching, no naming fatigue.

What Changed for Me

• Speed — I build UIs 2-3x faster now
• Consistency — design tokens are built into the utility classes
• No dead CSS — only the classes you use are included
• Responsive design — md:, lg: prefixes make it effortless

The "Ugly HTML" Argument

People say Tailwind makes your HTML ugly. Sure, the class strings can get long. But I'd rather have all my styles visible in one place than scattered across files.

The best CSS is the CSS you don't have to maintain separately from your components.

Dark Mode

One of my favorite Tailwind features is how easy dark mode is. Just add dark: prefix:

className="bg-white dark:bg-black text-black dark:text-white"

That's it. No separate theme files, no CSS variables juggling.

Verdict

If you haven't tried Tailwind, give it a real shot for a week. Not a todo app — a real project. You'll probably never go back.