Skip to content

My view of Tailwind CSS

Posted on:July 28, 2021 at 03:33 PM
My view of Tailwind CSS

I have now used Tailwind CSS v2.2 to update two websites. They were both fairly basic landing pages, the first was originally written by another developer, the second, was an update to one I personally had written. After that experience, I’d like to jot down all my thoughts and mostly likely review this post over time as I forget, and as Tailwindcss itself improves.

For those who don’t know, Tailwinds is a css utility library. In a nutshell: It gives you low level classes so you can use a chain of css property classes to express your css inline in the html class of an element. The compiler has the ability to inspect the html/css to only build styles that are used. Last, it includes the ability to auto generate specific attribute values for themes, so you have a custom bundle of css properties and theme specific values.

It has exploded on the web dev scene with the first version, 1.0 being released in May of 2019. It already has over 45k github stars at the time of this article (v2.2.6) at the end of July 2021.

When I first started using it, I was enamored and though it could be the missing piece in my web dev toolkit.

I’ll start by going over the positives:

That’s a lot of positives. And thinking back to my own usage, I have to admit, it felt clean/simple. Even though I only used Tailwindcss for two landing pages, I could do nearly everything I needed. But there are a few drawbacks to the framework:

In the end, it’s hard to say if I’ll continue with using Tailwindcss. For more than a simple landing page, it’s unlikely. Without it, my current methodology is to come up with a style guide and branding upfront for each project, set rules, and consistently follow them for new product design.

Is it worth learning? Depends. I think everyone should learn at least one framework and experience how consistent the development/usage can be, especially on a project with other developers. Now that I already know Tailwinds, I’d likely use it on smaller projects like a landing page, however for custom applications, I’d most likely do it with custom css or scss.