I’ve got a “love-hate” relationship with Tailwind CSS.

On the mindset front, I like the utility-first approach, but I can’t seem to get by with long class strings or adding additional complexity to my build setup.

As for the actual experience - it’s great! Very productive, easy-to-use, and makes me forget all my “imaginary” nitpicks. However, the difficulties with class composition (different Tailwind utilities don’t always override the others as intended), slow build times, and laggy CSS debugging in the browser’s dev tools drive me nuts.

But even with all those pros and cons, I still ended up using Tailwind for my latest product - CodeWrite (blogging tool for developers) - and have enjoyed the experience so far. Even to a point where I created my own tools for dealing with class composition, only to continue using it!

With that said, that doesn’t mean that I didn’t look for alternatives. The problem is - there aren’t that many. So few, in fact, that it’s hard to find another good list of “top X Tailwind CSS alternatives” (I didn’t know that was even possible).

However, I did find some - 4, to be precise. Those that I truly deemed worthy alternatives to Tailwind CSS. All of them share a similar utility-first ideology but also some unique features. Let’s check them out!

Tachyons

Windi CSS

XStyled

Chakra UI

#framework #javascript #react #typescript #library