Thanks for Tailwind

[jimohalloran]

Hi,

Just wanted to say thanks to the Tailwind team for what they've put together! Tailwind and piqued my interest a while ago, but wasn't in a position to put it to use, so I watched from afar. Taking the time to learn the philosophy, but not able to get hands on with it. I started a new project a couple of months ago (based on Laravel Jetstream) and this was my chance to get stuck in.

Over the last couple of months, I've been able to draw pretty heavily on Tailwind UI (we bought a team licence), and build out most of the components we'll need to complete the application. We're a long way from done, but so far the experience has been amazing.

At first the long strings of classes on many elements was a massive turn off. I really didn't like the way it looked, and felt it interfered with the clarity of the markup. That took only a couple of days to get over though, and now that I can mentally parse the Tailwind classes into what they're doing (margins, padding, etc) I'm really enjoying being able to look at my markup and "see" the layout without having to read a separate style sheet and figure out what selectors do/don't apply. Where copy/paste reuse is the order of the day, I also like that copy/pasted markup brings all of the style with it too. There's never an issue with a CSS selector that depends on some grandparent element that wasn't in the copy/paste block.

I'm a full stack developer, but backend is my major strength. Generally in the past I've had to reach for 3rd party libraries for modals and other "advanced" UI elements because a lot of that kind of layout was well beyond my capabilities. We're pretty heavily bought into the Tailwind ecosystem at this point (Tailwind CSS, Typography, Forms, a load of stuff from Tailwind UI, and Headless UI too). But unlike when I used to pull in 3rd party components, I actually feel like I understand a lot of this stuff. If want variations of a notification toast in different colours, I can do that easily, I don't need to wrestle some component to make it work.

So far the front end of this app is Tailwind, Headless UI and Vue, nothing else. And we haven't written a single line of our own CSS. For probably the first time ever, I actually feel like I'm in complete control of my front end, and I love it.

Thanks to everyone who's involved with Tailwind, for the amazing things you've produced! It's been a revelation to me! I also wanted to give a special shout out to Simon for his amazing videos. Whenever a new one comes out, they're required morning coffee viewing. Great, crisp, clear explanations, very well done. Also, to the docs team, the documentation is both awesome and invaluable.

[simonswiss]

@jimohalloran,

Thank you so much for this wonderful post! ❤️

At first the long strings of classes on many elements was a massive turn off. I really didn't like the way it looked, and felt it interfered with the clarity of the markup. That took only a couple of days to get over though, and now that I can mentally parse the Tailwind classes into what they're doing (margins, padding, etc) I'm really enjoying being able to look at my markup and "see" the layout without having to read a separate style sheet and figure out what selectors do/don't apply

I went through the exact same experience initially! What starts as an ugly, distracting "noise" cluttering the HTML progressively morphs into incredibly useful insight on how a block of HTML markup will look, and your brain can literally "see" the UI while reading the markup.

This is one of the typical experiences you cannot explain to anyone who hasn't gave Tailwind CSS a real try.

---

We haven't written a single line of our own CSS. For probably the first time ever, I actually feel like I'm in complete control of my front end, and I love it.

In a conference talk I presented, I said pretty much exactly that near the end of the talk. My words were, I believe:

My CSS anxiety is completely gone. I feel like I am in total control, and the cognitive load of managing styles remains extremely low.

That's really an amazing feeling, particularly if you've worked with large, complex CSS codebases spinning out of control.

---

I also wanted to give a special shout out to Simon for his amazing videos. Whenever a new one comes out, they've required morning coffee viewing. Great, crisp, clear explanations, very well done.

Thank you so much! 🤗

This comment means a lot – I put a lot of effort and thoughts in making the videos as easy & pleasant to follow, and hearing that means a lot 👍

Morning coffee is one of my favourite things in life, and I am glad I get to be part of yours from time to time ✨