December 29, 2020

2020 Year in Review

Last year didn't look too bad on paper, but I came out of it feeling like I hadn't accomplished as much as I would have liked, and feeling like I didn't get to spend enough time doing the types of work I enjoy most.

This year — despite all of the "2020 is so awful omg is it ever going to be over"-ness you're probably tired of reading about — was better. In fact it was probably the most rewarding and productive year of my career.

Highlights

  • Released Tailwind UI — we finally opened up access to Tailwind UI, after a grueling Q4 in 2019 trying to figure out what the product should actually be and what direction to take it.
  • Built a team — we started the year as just me and Steve, and finished it with four full-time team members, tripling our company size.
  • Released 8 minor releases for Tailwind CSS v1.x — which included long-requested features like CSS grid support, transitions, transforms, animations, gradients, and more.
  • Released Headless UI v0.1 — the first release of our headless component library for React and Vue.
  • Released Tailwind Play — the official Tailwind CSS online playground, making it easier than ever to learn Tailwind.
  • Started the Tailwind Labs YouTube channel — with new content every few weeks that have proven to be a big hit.
  • Released Tailwind CSS v2.0 — the most exciting Tailwind CSS release ever, including a brand new website that I'm still wow'd by every time I look at it.
  • Published 21 Full Stack Radio episodes — not quite the bi-weekly schedule I've tried to stick to traditionally, but still an awesome batch of content for the year.

Personal

The biggest personal change for me this year was that I managed to lose over 40lb, dropping from around 245lg (111kg) at my heaviest before Christmas down to 201lb (91kg) by late August.

Before and after photo Me at 245lb on left and 201lb on right

I did this just through basic diet and calorie counting. I used Lose It! to track my calories, and tried to stay under 2000 calories per day.

The bad news is that since August I've managed to gain back about 20lb. Things got really stressful working towards the Tailwind CSS v2.0 release which ate away at my will power, and once I had broken the chain I felt defeated and had a hard time building back into my better habits. Really disappointed but on the bright side I'm still 20lb lighter than I was last year.

Still have a goal of hitting 185lb, and even just writing this is getting me fired up to really take it seriously again.

Business

Financially, 2020 was our best year ever. Crazy to keep saying that every year, especially since I was totally convinced in 2018 that that was going to be the best year I would ever have.

Refactoring UI is proving to be a perennial seller (it did about $600,000 in 2020) which is awesome, because I'm incredibly proud of that book. Hopefully we can give it some love in 2021 and maybe even do a physical version, if only to have something to show my kids.

We launched Tailwind UI in February, which ended up being the biggest launch we've ever had ($400,000 on the first day), and thanks to the Tailwind CSS documentation acting as an incredible distribution channel for us, sales have actually slowly trended up since the initial post-launch dip — a first for anything I've ever released.

We're reliably doing mid-seven figures per year which is just not something I ever expected to be able to say about one of my own businesses. I'm now the CEO of a multi-million dollar tech company — what the fuck? Tell that to Adam in 2016 when he quit his job over a $60,000 book launch and there's no way he would ever believe you.

The partnership Steve and I have has worked out so incredibly well for both of us, and working together has definitely multiplied the results we ever could have gotten separately.

We initially started the business as Refactoring UI Inc when Steve and I were planning to only do the book together, but after releasing Tailwind UI and turning this thing into the Tailwind business, we renamed the company to Tailwind Labs Inc which I still can't help but love to say out loud.

My personal business (NothingWorks Inc) that I sell my other books and courses through is slowly trending downwards financially as I focus on Tailwind Labs with Steve, but it still did six figures this year which is incredible for something I didn't have to put any work into at all. Being able to create is a superpower.

I stopped taking podcast sponsorships this year because the headache of managing sponsors and recording the ads was becoming a really annoying distraction, and even though it felt like I was giving up a lot of income at the time (about $50,000/yr), in hindsight I am so glad I did it. It's been much easier to stay focused on the things that matter, and our business has grown well beyond what was necessary to make up for that lost revenue.

Tailwind UI

The first big project of the year was getting Tailwind UI out the door. We started working on it in the summer of 2019, and scrapped and restarted the entire project I think 3 separate times as we learned more about what the project should actually be and how it should work.

We were hearing from people every single week offering to pay us for access to whatever we had finished so far, so despite bad experiences I've had in the past with early access releases (hello Test-Driven Laravel, which took 18 months to finish after opening early access), we decided to do an early access release.

After the most gruelling couple of months of my career, we finally launched early access on February 26. I worked for literally 40 hours straight to finish everything we needed for the launch, which I hope I never have to do again.

We launched with just over 150 examples, and throughout the rest of the year more than doubled that to 344 examples over 13 updates at the time I'm writing this.

We're still not quite at a point where we're comfortable removing the "early access" disclaimer, but we should be there by the end of January after we add some examples to a few of the remaining "coming soon" categories.

The project has been a huge success for us, and continues to make up the lion's share of our revenue each month.

The best part is that we've validated that focusing on the open-source stuff, continuing to make Tailwind CSS better, and teaching more people how to use the framework has been the most effective way to grow the business. There's always a risk that when you try to build a business around an open-source project that the business gets in the way of improving the open-source.

And that's not surprising! Trying to get a business to default alive is incredibly hard, and most businesses fail. The idea that it should be easy to just snap your fingers and create some magical business around an open-source tool that only takes 15 hours per week to run while paying you a full-time salary so you can spend 25 hours per week on open-source is comical. The fact that we've managed to do anything like that is a total miracle.

We have a ton of plans for continuing to expand and improve Tailwind UI in the future, and I really think it's going to be about 10x more valuable to Tailwind users by the end of 2021 than it is now. Seriously excited for where we're going with it next!

Building a team

After we released Tailwind UI, we had an incredible amount of work on our plate. We needed to:

  • Continue designing and building Tailwind UI examples
  • Add long-requested features to Tailwind CSS
  • Manage GitHub issues and pull requests across our projects
  • Maintain and improve the Tailwind CSS documentation
  • Maintain and develop the actual Tailwind UI web app where customers browse examples
  • Maintain and improve our internal tooling for Tailwind UI
  • Foster the community and help people be more successful with Tailwind CSS
  • Deal with all the administrative BS of running a business

...and tons more that I'm sure I'm forgetting. This combined with the huge immediate customer support burden that comes along with a big launch day had us feeling like we were completely underwater.

We decided that trying to handle all of this stuff with just the two of us was just not realistic, and that we really needed some extra help.

Our original plan was to bring on a third partner to help run the business, but it turns out that trying to make that work after the fact when a business is already profitable is complicated, and negotiations fizzled out when it felt like we weren't going to be able to come up with terms that everyone felt enthusiastic about.

I'm still disappointed this didn't work out — as much as I love the team we've built, there are certain types of stress and responsibility that only partners can help shoulder, and I think it would've helped me a lot to be able to spread that across a third person, especially technical stuff like worrying about all of our servers going down in the middle of the night (which literally happened this year while I was on a weekend away with my wife).

The first person we hired was Brad Cornes. I knew Brad already because he's been active in the Tailwind community since day one, and he built the Tailwind IntelliSense extension for VS Code. When I first reached out to Brad we were still expecting the partnership plans to work out, so we didn't really do much in terms of a hiring process. I already knew Brad and trusted him, so I just shot him an email asking if he'd be interested in working with us, then we did a pretty casual call to talk more about it and I sent him an offer.

When the partnership plans fizzled out, we decided to hire another person with the goal of filling that sort of partner-level role.

I put together a big detailed job posting that got a ton of attention, and we received over 900 applicants. Ultimately we realized the idea of hiring a partner was unrealistic, and that it's just not possible for someone to step into a company and shoulder that level of responsibility immediately. Seeing that Basecamp expects a designer to work there for at least 5 years before being able to be promoted to "Principal Designer" helped me understand and accept this, and in hindsight it makes a lot of sense.

Our hiring efforts weren't for naught though — despite realizing that trying to hire a partner-level contributor just didn't make any sense, we still met tons of incredible people and over the course of the year actually hired three of them.

  • Robin joined the team to lead the development of Headless UI, and has made tons of valuable contributions to our work on Tailwind CSS and Tailwind UI as well.
  • Simon joined us to lead our community and educational efforts, spearheading our YouTube channel and helping people succeed with Tailwind in our Discord server and discussion forum.
  • David is an accessibility expert who started working with us in late September for what was originally going to be an individual project, but has now joined the team full-time and leads a lot of the work on Tailwind UI.

I definitely didn't expect to finish the year with four full-time staff members (considering we started with zero), but without this team there is no way we could have done all of the cool stuff we did this year. We don't want to grow into a huge team and definitely want to slow down for 2021; I think we can do quite a lot with the team we've built so far without getting any bigger for a while.

Becoming a leader

Learning to direct a team has been a challenging and rewarding adventure. I've never been in a leadership role in my life, so it's completely new to me.

I took advantage of the network and audience that I've built over the years to get a lot of advice about how to do it right, including personal conversations with Ryan Singer, Ian Landsman, and Nathan Barry, and extremely helpful podcast interviews with Jason Cohen and Jason Fried.

We adopted Basecamp's Shape Up methodology for running our projects, which has been a godsend. A lot of the principals in Shape Up are things I've believed and practiced for years (flexing scope instead of time, teasing apart discrete scopes of work, building a feature end-to-end before starting something else), but the ideas that made the biggest difference were things I didn't immediately recognize as valuable.

When Brad first joined in June, I had it in my head that the best way to run projects was to only ever schedule one thing at a time. I'd plan out a project with Brad, we'd pick a deadline for it, and he'd work on it until the deadline, adjusting the scope as necessary to make sure we got it out the door. The problem was that a lot of the projects we were tackling weren't that big, maybe one or two week projects. As a result, it always felt like I was scrambling to get the next project planned, because I had to do more planning every week or two.

This was causing me to pick off smaller simple projects that didn't require a ton of deep planning effort, because I simply didn't have the time to plan the bigger projects properly. So the biggest projects that would have the highest impact were getting kicked down the road, and I'd constantly tell myself "ah we'll do that one next, I don't have time to fully think it through right now so let's just tackle another small one until I have more time."

I was really struggling with this until I had a transformative conversation with Ryan Singer, where he explained the real value of planning a full six weeks of work at once. By planning six weeks of work at a time, you only have to plan 7 or 8 times per year, so you can really give the planning the time it deserves.

On top of that, when you know you are planning for 6 weeks worth of time, you know that anything you don't include in that 6-week cycle is not going to get worked on for at least another 6–8 weeks. When you plan this way, the consequences of saying "ah we'll do that next" are more noticeable. Instead of thinking "next" means "in a week or two" (but continuing to postpone it because you never have time to plan), "next" means "in 6–8 weeks". When you can see that you are pushing something out 6–8 weeks, it becomes really clear if that's acceptable. If you know you're not okay with something waiting 6–8 weeks, you figure out a way to fit it into the cycle.

Switching to this way of planning made a huge difference in our ability to prioritize and execute on important high impact projects, and also gave me way more time to focus on actual engineering work, because I'm not constantly planning the next little project just in the nick of time.

I still have a lot to learn a leading a team but I'm looking forward to growing in this area, and am really proud of the improvements I've made already.

Tailwind CSS

2020 was an enormous year for Tailwind CSS, and we put out an unreal amount of new stuff.

v1.x updates

We released eight (!) new minor releases of Tailwind CSS v1.x this year, all including a lot of exciting, long-requested features:

  • v1.2 in January, which added transitions, transforms, and CSS Grid support
  • v1.3 in April, which added the new space and divide utilities for declarative layout
  • v1.4 also in April, which added color opacity utilities and built-in PurgeCSS support
  • v1.5 in July, which added component variants, focus-visible support, and more
  • v1.6 also in July, which added animation support
  • v1.7 in August, which added gradients
  • v1.8 in September, which added font-variant-numeric utilities and experimental dark mode support
  • v1.9 in October, which added "presets"

A lot of these features were things that people initially requested way back in 2017 (!), so getting this stuff into the framework was awesome. Looking back I can't even believe that we didn't have stuff like transitions, transforms, or grid at the beginning of the year.

IntelliSense

We made Brad's IntelliSense plugin for VS Code official, and Brad spent a bunch of time throughout the year continuing to improve it and add new features.

JetBrains even added their own version of this to their IDEs towards the end of the year, which was so cool to see.

@tailwindcss/typography

In July, Brad and I built and released @tailwindcss/typography which is a plugin for adding sensible default typography styles that you can use to style markdown or other CMS-driven content.

This was a huge pain in the ass to design and develop, and we're still not really happy with the customization story, but users seem to love it and I'm looking forward to continuing to improve it going forward.

YouTube Channel

In September we started the official Tailwind Labs YouTube Channel, and Simon has been posting lots of great content there regularly.

We created a "What's new in Tailwind CSS" series where we publish short videos teaching you how new Tailwind features work every time we put out a new release, and Simon has been hosting some really cool conversations in the "Tailwind Talk" series where he talks to different people in the community about their experience with the framework and solves different problems with them.

We have lots of big plans for growing this in the new year and I think it's going to be a huge channel for adoption.

Tailwind Play

In October, we launched Tailwind Play which is an online Tailwind CSS sandbox that lets you play with all of Tailwind's features (including customizing the config, using @apply, etc.) directly in the browser, without installing or configuring a bunch of build tools.

This turned out so amazing and it has been extremely helpful both for people learning Tailwind, as well as for us as maintainers because it's so much easier for people to create reproductions of their problems.

Tailwind CSS v2.0

On November 18th we released Tailwind CSS v2.0. This was absolutely the biggest project of the entire year, and took a monumental amount of effort to get out the door.

The framework itself didn't change that much (most of the new features were already available behind flags), but there were a couple of breaking changes we wanted to make (mostly a new color palette) that necessitated a major version bump. Because the framework itself wasn't radically different, we decided that the best way to make the most of the inherent excitement that comes along with a v2.0 was to invest a lot of time into the marketing side of it.

This included designing and building a brand new website, and even putting together a completely over-the-top Hollywood-style trailer:

The music in the trailer was custom scored just for us by a friend of mine, and the choir chants at the end are a real-life professional opera singer chanting "utility-first" in Latin. This is the sort of ridiculous shit I live for.

The new website came out incredible — the homepage is seriously a work of art. I spent so much time getting all of the copy just right, and telling the story as best as I could. My goal was for someone to be able to read the homepage from top to bottom and basically know how to use the framework well-enough to start playing around without reading the docs.

At the same time, we wanted it to be visually exciting and elevate the company into a different league from a design perspective. I think we nailed it — we came up with a simple pattern for explaining each feature that looked beautiful without being distracting, and all of the fancy interactivity and animations actually serve the content perfectly and teach you how the framework works instead of getting in the way.

Updating Tailwind UI

This was the hardest part of releasing Tailwind CSS v2.0. The whole reason we wanted to release v2.0 is because we wanted Tailwind UI to rely entirely on the Tailwind defaults, and not require an extra plugin like @tailwindcss/ui like it had up until v2.0 was released.

A lot of the functionality we added to v2.0 let us simplify a lot of the code in the Tailwind UI examples, but there are hundreds of examples, so manually updating them was an incredible undertaking. Robin developed a lot of really wild scripts using PostHTML for automating a lot of it which was super helpful, but it was still a ton of work.

I even had to rework the entire Laravel backend to simultaneously support v1 and v2 at the same time because we didn't want to screw over customers who were stuck on v1 for whatever reason, or were in the middle of a project.

@tailwindcss/aspect-ratio and @tailwindcss/forms

As part of releasing v2.0 and updating the Tailwind UI examples, we developed two new plugins that we needed in order to remove the need for the Tailwind UI-specific @tailwindcss/ui plugin.

The aspect ratio plugin makes it easy to size an element based on an aspect ratio (useful for images and videos), and the forms plugin adds very basic default form styles to all form elements that are designed to be easy to customize with utilities instead of custom CSS.

These two plugins were the final puzzle pieces we needed to make Tailwind UI feel like it truly just relied on sort of default universal Tailwind stuff. Some examples require these plugins, but because they are general purpose instead of Tailwind UI-specific, that felt like a victory.

The whole process of getting Tailwind CSS v2.0 out the door and getting Tailwind UI updated was incredibly stressful, and definitely what led to me falling off the wagon with my weight loss which sucks. I'm extremely proud of what came out of it though, and we took basically all of December really slow to recharge, since October and November felt like being put through a meat grinder.

Growth statistics

Tailwind dominated the State of CSS this year, with the highest satisfaction rating of any framework by a large margin, and winning their "Most Adopted Technology" award which was so cool to see.

The framework has grown like crazy this year:

  • We published a total of 81 (!) releases
  • Downloaded 19 million times total, and over 2 million times every month now
  • Over 55k followers on Twitter (120% growth)
  • The GitHub repo has been starred over 33,000 times (94% growth)
  • Over 15,000 members in the Discord community (150% growth)
  • We're up to 152 contributors on the project (58% growth)

I think the biggest reason for the growth is just that we've been able to focus on it full-time, build a team around it, and put out so much cool stuff. It's rare that people can put as much attention into an open-source project as we're able to with Tailwind, and I think it's paying off.

Heroicons

In May we released Heroicons, a new set of application UI icons that Steve designed initially for Tailwind UI. These have proven to be super popular, and I know Steve is excited to keep developing them.

We built a really nice website for the project in August after initially releasing only to GitHub, and the experience turned out really nice. I use it myself every day for grabbing icons now!

Headless UI

In August, Robin and I started working on Headless UI, a set of headless UI components for both React and Vue (and hopefully Alpine in the future) that make it really easy to build fully accessible dropdowns, toggles, modals, etc., without giving up the ability to easily style them with utility classes.

This is a massive undertaking, and building these libraries with the perfect API is really challenging but rewarding work.

Originally these were just going to be called @tailwindui/react and @tailwindui/vue, but we eventually decided that those names were extremely confusing and sounded like React and Vue versions of Tailwind UI. I came up with the Headless UI name in September and it really grew on us.

If you look closely enough, you'll notice the logo is actually a guillotine (but, erm, a cute one?)

Headless UI

We published the first release in September and people were super excited about it.

After getting the first few components out the door we needed to shift our focus to Tailwind CSS v2.0, but I'm looking forward to picking back up on this project in January. It's going to enable us to provide React and Vue versions of everything we're doing with Tailwind UI, which I think is going to open up a huge new segment of the market for us and really help us grow the business.

Speaking

I was supposed to give a Tailwind CSS talk at SuperConf in March of this year and even travelled to Miami for the conference. But it ended up getting cancelled the day before due to COVID, so I was never able to give the talk. Bummer because I think it was going to be a good one!

The only talk I ended up giving was a talk on "Building a Component Library with Tailwind CSS" at Laracon Online in August, which went well but was ultimately pretty stressful to prepare for while also trying to lead the team at Tailwind Labs.

In the future I likely won't be doing much speaking, maybe a talk once every few years and only at in-person events as an excuse to hang out with others in the community.

Writing

I published a bunch of announcements on the Tailwind CSS blog this year, but not too much in terms of real articles.

Here are the three real things I published:

I always say I'd like to do more writing, but really if I only do a handful of good posts per year like this, I'm happy with that.

Podcasting

I published 21 new episodes of Full Stack Radio this year — not quite the bi-weekly schedule I've maintained historically but not far off.

Here are a few of my favorites:

At one point I considered just stopping the podcast because it's a lot of work to maintain, but I think ultimately I'm just going to slow down with it, and only publish new stuff when I have good new stuff to publish instead of sticking to a schedule. I don't want to treat it as some important marketing channel, I just want to use it for the reasons I originally started it, which is to have interesting conversations with people when there's something I'm really excited about learning about.

I bet I'll do ~10 episodes next year.

Looking ahead to 2021

This year was great and I couldn't be happier with all of the stuff I achieved myself as well as the stuff we achieved as a company.

Things I'm looking forward to next year:

  • Continuing to take my nutrition seriously and reaching my body composition goals
  • Having another baby in the spring
  • Adding JS support to Tailwind UI
  • Getting to a v1.0 with Headless UI and building out a proper documentation website
  • Exploring new product ideas in the Tailwind UI space, including library-style UI kits and more traditional themes

Always excited for the future.