How I Think About Styling in React Now

I used to be very opinionated about CSS.

Like, unreasonably opinionated.

I cared a lot about separation of concerns. CSS in CSS files, logic in JS, clean structure, proper naming. If I saw styles inside JSX, I would immediately assume it was messy code.

Then I tried Tailwind.

At first I resisted it. It felt wrong. Putting a bunch of utility classes directly in className looked like going backwards. But I gave it a shot on a small project.

And I got fast. Really fast ⚡

I remember building a card component in a few minutes and thinking, “wait… that’s it?” No switching files, no naming classes, no writing separate CSS. Just done.

That kind of speed changes how you work. You stop overthinking styling decisions and just move on to building things.

So for a while, I was all in.

After shipping a few projects with Tailwind though, I started noticing something I didn’t expect.

The code felt kind of disposable.

Not broken. Not messy in a this is bad code way. Just like it did not invite you to come back and work on it. Long class strings everywhere, repeated patterns, small tweaks spread across multiple components.

It worked, but it did not feel great to revisit.

Around that time I tried Styled Components on a different project.

And it felt completely different.

At first it was slower. You are writing actual styles again, thinking about structure a bit more. But everything lived together, component and styles in one place, and it was easier to understand what was going on when I came back to it later.

Also, anything dynamic just made sense. Passing props into styles felt natural instead of something you had to work around.

It was not perfect though. There is more happening under the hood, and you do notice that sometimes. Debugging can be a bit annoying, and setting things up for SSR took extra effort.

But still, the code felt more intentional, I guess.

Then there is CSS Modules, which I ended up using on a component library.

That experience was different again.

It is basically just CSS, but without the global chaos. Styles are scoped, things do not clash, and there is no runtime overhead.

What I liked there was how predictable everything felt. You open a CSS file, you know what is going on. JSX stays clean. Debugging is straightforward.

But you do lose some of the convenience. You are back to managing your own spacing, colors, structure. And anything dynamic is a bit more work.

At some point I realized I kept switching not because one tool was better, but because each one solved a different kind of problem.

Tailwind made me fast ⚡
Styled Components made things easier to reason about later 🧠
CSS Modules made things feel stable and predictable 🧩

None of them felt wrong. Just different.

One thing I tried, which I do not see people talk about much, was mixing them.

I had a project where I used Tailwind for most of the UI, CSS Modules for a few complex layouts, and Styled Components for theming.

It sounds messy, but it actually worked fine.

The only catch is you have to be a bit intentional about it. If you just mix things randomly, it can get confusing pretty quickly.

Right now, I default to Tailwind.

Not because I think it is the best, but because it helps me move faster and I do not have to think too much when I am building things.

But if I knew I was going to maintain a project for years, I would probably lean toward Styled Components or even CSS Modules.

That is just based on how it has felt working with them over time.

I think the biggest shift for me was realizing this is not really about picking the right tool.

Each of these approaches just moves complexity to a different place.

With Tailwind, it shows up in your JSX.
With Styled Components, it shows up in JavaScript and runtime behavior.
With CSS Modules, it shows up in your CSS files.

You are not avoiding complexity. You are choosing where you want to deal with it.

Anyway, that is where I have landed for now.

Curious what others are using and how that changed over time. Did you stick with one approach or switch like I did?