Adam Wathan

Tailwind CSS v1.0 — A utility-first CSS framework for building custom designs.

Featured
83
Most frameworks make it really hard to build custom designs, but Tailwind is different. Instead of predesigned components, Tailwind provides low-level utility classes that let you build completely custom designs without ever leaving your HTML.

Add a comment

Replies
Best
Adam Wathan
Top Product
Maker
👋🏻 Hey folks! About a year and a half ago we launched the first 0.x version of Tailwind CSS and today we're finally releasing v1. Let me know what you think and if you have any questions I'll do my best to answer!
Lee Overy
@adamwathan congrats man. Been using it since the beginning. Love it and won’t ever go back to naming stuff. I do not miss having to come up with random names and triggering my ocd when it’s not perfect!
Jakub Arbet
@adamwathan thanks for the amazing job. Loved especially how you involved the community in the making 👍✨
Adib Hanna
Best thing that happened to CSS in recent years
Daniel Matthews

I've been using this since the earliest versions, it's changed the way i write CSS on projects and it's currently shipped on 10+ of my client projects.

Pros:

Fast, great for building custom UIs quickly. Fantastic documentation. Great community.

Cons:

May inspire teen levels of angst in those opposed to component based CSS.

tom meagher
@adamwathan big fan! who do you think can benefit most from the new release? what’s your favorite part about v1?
Adam Wathan
Top Product
Maker
@tomfme Thanks Tom! I think the most exciting part about releasing a v1 is that hopefully it will get Tailwind into the hands of more people who aren't comfortable being bleeding edge early adopters. With any luck the fact that it doesn't have that "alpha" label attached anymore means a lot more people will use it for their projects. My favorite part about v1 is that it's released and I can sleep at night again 😅 Seriously though I like the new config file approach a lot.
Martin Betz
Lots of reasons why Tailwind CSS is a perfect web design companion: - It is so much more flexible than frameworks like Bootstrap and Bulma - It's the most direct connection between "This is what I think it should look like" and implementing it in HTML with class names that are easy to remember - It is perfect for total beginners and pros alike - It is very well documented (lots of examples and ways how to tweak it) - There is an active community with loads of hands-on tutorials, plugins and tools
Alexander Lichter

I use Tailwind CSS in nearly every project because it is so flexible, easy to use and especially easy to configure/change, compared to other frameworks.

Pros:

Simplicity, structure and configuration. Also a superb documentation!

Cons:

None so far!

Jalen Davenport

Tailwind has now become a staple on any new project I start 👌 Switching to an old project that was created without Tailwind is an absolute pain; my productivity is literally cut to 1/4 of what it is on a new Tailwind project. It makes CSS easier and less painful, whether you've been writing it for only days or for years. Would 100% recommend!

Pros:

Makes website prototyping/development blazing fast, super flexible and customizable, and a joy to use...

Cons:

A lot of people initially dislike the utility-first classes idea, but once you try Tailwind you'll slowly but surely become a convert...

🏴󠁧󠁢󠁳󠁣󠁴󠁿 🇬🇧 🇪🇺 Steven Grant 👨🏻‍💻 🥁
I wasn't sure about it at first but, it's made me a lot quicker to prototype and ultimately launch. Naming things is hard, especially CSS selectors. Not with Tailwind.
Yann
Been using it in several products already. I really really don't want to go back to Bootstrap anymore after having used tailwind. There's so much thought put into this that takes a lot of work off my plate. Especially the work on color is amazing. Thank you!
Stefan Bauer

I'am an early adopter who's using tailwind from the very beginning. It was a game changer and it makes fun writing CSS again.

Pros:

It is easy to use, super fast, super slim (when using it correctly), extendable, 100% customizable and it makes fun creating CSS again.

Cons:

None (for me!)

Miguel Piedrafita

I've used Tailwind on every project I've worked on since I first tried it, it's really the perfect companion for any dev!

Pros:

Makes it really easier to bring to life any design you can imagine

Cons:

Makes going back to writing CSS painful

Justin Jackson

Move over Bootstrap, Tailwind is in town.

Pros:

The pre-built components are incredible!

Cons:

Can't think of any

Aaron O'Leary
whats new in this update?
Adam Wathan
Top Product
Maker
@aaronoleary Hey Aaron! I just put together a quick release notes post here: https://tailwindcss.com/docs/rel... In short: - New simplified config file approach - New default color palette - Some new utilities (order, top/right/bottom/left, a few other small ones) Most importantly, the API is stable and locked in, so hopefully folks who weren't comfortable using it at 0.x can feel safer giving it a chance now 👍🏻
Caleb Smith

I went all in on using Tailwind as the backbone of my companies UI Kit as soon as the Beta1 came out - I have had no regrets. As a Vue developer, it has really streamlined my processes while eliminating some "clutter classes" that I never used with Bootstrap. The classes are very readable and the use of Pseudo-classes are amazing. You will not be disappointed by making the switch over to Tailwind for your future projects.

Pros:

Easy to use, classes are common sense and closely aligned with some Bootstrap classes, and a nice clean slate for barebones projects.

Cons:

This is not a UI kit. This is not a 1:1 Bootstrap replacement. This can be a con, depending on who you are.

Roger Pence
Tailwind is one of those things that at first glance you may be inclined to dismiss. Its inline approach is at first a little jarring--but stick with it. TW makes prototyping faster, maintaining easier, and just generally writing CSS less painful. However, PurgeCSS is a nearly a must and that is a TW weakspot. Getting PurgeCSS setup for anyone not familiar with configuring a dev pipeline is a TW speedbump. That said, that's also doable -- you just need to expend a little elbow grease. I'm not looking back -- TW is great.
Christoph Rumpel

I've been using it now for like a year and love how fast I can write CSS and style but still following a plan which is in my configuration file.

Pros:

It's fast, it's easy, it's still CSS and comes with a great configuration file. don't mistake it for normal inline styles. It is much more!

Cons:

It takes some time to FEEL the difference, you need to rethink your workflow

Debarati Ghosh
is it provide templets also?
eelco
@debarati_ghosh if you are Ruby/Rails dev, you can see UI template and separate components on https://www.getsjabloon.com :)
Chris Faulkner

I use Tailwind for all my new projects now, it's just so much easier to work with. Some people say that they prefer writing custom CSS, the thing is you can still do that without restrictions. Going back to older projects that aren't set up with Tailwind is kinda painful now.

Pros:

Speed, ease and consistency of new designs. Not tied to any specific style as some frameworks are

Cons:

People don't understand how good this is unless they give it a go.

Michael Dyrynda

Been using Tailwind in production since around 0.6 and it's clear that Adam has put a lot of thought into making the most flexible utility-first CSS Framework out there. It has a great balance between a lot of options and some great defaults in terms of colours and fonts, without providing you default-looking components that you'll find cropping up on every site using it in a few months like some other frameworks. Definitely check out some of the videos Adam posted on his YouTube channel where he duplicates existing web apps with just the out of the box utilities. Most importantly; don't hate on the idea of utility-first CSS until you give it a go. It's a powerful tool and there's no wonder places like GitHub and Algolia are leveraging the methodology.

Pros:

Really helps you rapidly build out pretty much any design with just utility classes. Rarely will you find yourself creating custom CSS

Cons:

You have to already know CSS pretty well to use it; the classes are wrappers over underlying CSS attributes.

Stefan Zweifel

I use Tailwind CSS since v0.2.0 and it changed the way I write CSS for application and websites.

Pros:

Super easy to use. Streamlines the development process with a single configuration file which can follow your design system.

Cons:

Takes a bit of time to get into it, but when you reach that point, you don't want to anything else ever again.