Is Tailwind CSS Worth It?
The Good, the Bad, and the Ugly of Utility-Based CSS
CSS utility classes have been around for a long time now. However, their popularity has recently skyrocketed with the adoption of libraries like Tailwind CSS. In this article, I want to share my thoughts, opinions, and hot takes about how tools like this change the user experience for developers and alter our relationship with the DOM. Feel free to completely disagree with me!
What Problem Are We Trying To Solve?
In my view, the goal of a utility class-based system is to decouple. You can decouple your component styles from the HTML structure. You can decouple your rules from grouped component styles. At first glance, this sounds great, and it is. However, this methodology comes with its own set of problems.
CSS utility classes, or Functional CSS, are all about thinking small. The goal is to break up your app into a ton of little tiny classes that do one thing. You may have heard of a similar concept in programming called the Single Responsibility Principle or Functional Programming. In CSS, the same concept exists. For example, they might center text in a div with a class called .text-center. These tiny classes are then composed together on a DOM element until the desired result is achieved.
