Home
Starting Up
Case Studies DB
Products
Ideas DB
Vibe Coding Tools
Subscribe to IH+
Starting Up
Case Studies
Ideas DB
Products DB
Sign in
Join
11
Likes
6
Comments
Rapid Prototyping with Utility-First CSS (Tailwind)
by
Hrishikesh Pardeshi
https://twitter.com/hrishiptweets/status/1317091510945378304
I really did not like the idea of polluting HTML templates with a bunch of utility classes. From a software engineering perspective, it seems like an awful violation of good practices (separation of document markup and styling).
Well, after trying it, I've been converted. I now use it all the time for quick landing pages and prototypes.
I'm not sure if I would use it for large projects that need to be maintained for a long time. I think the best of both worlds would be writing custom CSS classes and then just extending the Tailwind utility classes using SCSS in your stylesheets. Anybody tried this before?
You can easily achieve separation of concerns by abstracting out components from the utility classes you have used. I just think this shouldn't worry you much upfront. That's what I like most about Tailwind.
There's also this fantastic blog by Adam Wathan on the topic - https://adamwathan.me/css-utility-classes-and-separation-of-concerns
For someone who isn't well-versed in front end development, is it worth using Tailwind over a CSS framework that comes with predefined components (like Bulma)?
I think something like Bootstrap or Bulma (pre-defined components) is a better choice when you don't want a custom UI e.g. if I want to get a quick marketing page for my side project, I would probably go with that. Tailwind is amazing when you need the flexibility to custom design things.
Now I still feel Tailwind is a great choice even if you aren't so well versed with frontend or tried it before. There isn't much of a learning curve but yes, you'll need to take care of a lot of things on your own. I would prefer choosing Tailwind over other frameworks purely basis the use-case.
Hope this helps :)
Great overview.
I’m using tailwind as well and just find it so enjoyable.
The screencasts on the Tailwindcss website themselves are a great primer on how to use it and also taught me some nice design tricks.
Thanks Kenneth :)
I think I missed this in my thread - Absolutely agree, I enjoy using Tailwind!
For some quick context, I am using Bootstrap on my other website, Remote Tools, and it is exhausting to even think of making tweaks to the UI. With Tailwind, I don't have that feeling. In fact, many times, I am just playing around with the elements or the UI to see what looks better.