Tailwind CSS

Tailwind CSS: It looks awful, and it works

Adam Wathan's talk at Rails World 2023, titled: "You won't like it until you try it!"

In his talk at #RailsWorld, Tailwind CSS creator @AdamWathan of @TailwindLabs explains why “separation of concerns” isn’t the right way to think about the relationship between HTML and CSS, why presentational class names lead to code that’s so much easier to maintain, as well as loads of tips, tricks, and best practices for getting the most out of Tailwind CSS.

I fell in love with Tailwind at first sight and I've been using it for years now. But it's not that kind of love story where you're completely blind to the flaws and trade-offs. As a developer, I appreciate the succinct utility that the framework brings to the table. Its approach to styling, where you compose styles directly in your HTML, allows for rapid development and easy maintenance. The class-based system enables a clear and concise representation of styles, making it a breeze to read and understand, even for those who may not be deeply familiar with the project.

However, every love story has its complexities. While Tailwind excels in providing a streamlined and utility-first approach, some developers might find the extensive list of utility classes overwhelming. Learning and memorizing the class names can be a hurdle for newcomers, and striking the right balance between customization and adherence to established styles may require a thoughtful approach.

Moreover, some argue that the inline styling approach might lead to HTML files becoming cluttered with classes, potentially impacting readability. It's a trade-off between convenience and maintaining separation of concerns between HTML and CSS.

Despite its challenges and trade-offs, my journey with Tailwind has been a rewarding one, as it boosted my productivity in web development thanks to its utility-first approach and class-based system.