We surveyed over 11,000 CSS developers. Here’s what we learned.


?➡️ View the Survey Results


The Story

It all started three years ago when I was faced with a tough choice: deciding which JavaScript library to learn next. Picking the wrong option could potentially mean investing hundreds of hours into a doomed technology, so I thought I'd ask around before committing to a new framework.

Asking around turned into launching a small developer survey, which in turn got a surprising amount of interest from the community. Fast-forward three years and we're now onto our third State of JavaScript survey, with a reach of over 20,000 developers!

But as the survey has grown in depth and length, we've also realized just how complex the web ecosystem truly is. And that while JavaScript is a big part of it, it's by no means the only one.

Which is why it only made sense to expand horizontally into new territories, the first of which is CSS, a.k.a. JavaScript's arch-nemesis and/or best friend depending on who you ask.

And after a few months of data processing and visualizing, I'm happy to finally be able to share with you the first ever State of CSS survey results!

I definitely encourage you to check out the full results, but in the meantime here are a few trends we noticed looking at the data.

Flexbox is “Winning”… But for How Long?

features_layout_features-section-overview
Layout Features Overview

While Flexbox and CSS Grid both have near-total awareness (in other words, everybody knows what they are), it's interesting to see that only about 55% of developers have actually used Grid.

There are a few probably reasons for this. Flexbox has been around for longer, and came around at a time where we desperately needed an alternative to floats for layout. Also, Grid is admittedly a little bit more complex (but also much more powerful!).

The truth is that both Grid and Flexbox have their pros and cons, and they should both be part of a developer's toolbox. So it wouldn't surprise us if those two circles become much more similar over the next couple years!

Utility-First CSS is on the Rise; Bootstrap is in a Slump

technologies_css-frameworks_tools-section-overview
Ranking CSS frameworks for awareness, interest, and satisfaction

For years Bootstrap was the uncontested king of UI frameworks. This shows up clearly in our data, with a whopping 99% of respondents being aware of it. No other competitor comes close in terms of awareness, with second-best Foundation coming in at “just” 79%.

It shouldn't be surprising that this high awareness corresponds with a low interest ratio, since developers who haven't yet used Bootstrap for whatever reason are probably not that keen to start now. More worrying is the comparatively low satisfaction ratio, at just 52%.

Contrast this with Tailwind, which boasts a 81% satisfaction ratio! It might have a low awareness score (only 34% of respondents knew about it), but it's making its users very happy and at the end of the day that's the most important factor. And right behind it with 74% is Bulma, which shares a lot of the same “utility-first” concepts as Tailwind.

Are we moving away from big, monolithic frameworks like Bootstrap towards more nimble, pick-what-you-want libraries like Tailwind? In any case, it'll definitely be interesting to keep an eye on this trend over the next few years.

There's Still a lot of Uncertainty in CSS Land

technologies_tools-scatterplot
Plotting satisfaction percentages vs user counts

The above chart of CSS technologies is divided into four quadrants, and as you can see the “Assess” quadrant (corresponding to up-and-coming technologies with low user counts but high satisfaction) is by far the busiest.

In fact there are only three “established” technologies in the “Adopt” quadrant (high usage, high satisfaction): BEM, Sass, and Bootstrap. And Bootstrap is getting dangerously close to falling off…

This goes to show that things are still very much in flux in the CSS world, which can be surprising for an ecosystem that has been around for so long. But this is the world of web development after all: as soon as you think you've finally figured it out, something new comes along and makes you question everything you thought you knew!

One More Thing…

We're trying something new this year: we're coming out with an official State of CSS t-shirt!

tshirt5
Learn CSS and look good in the process!

The t-shirt features our CSS logo, along with some of the actual code used to make it. Where else can you get a shirt that looks cool while also teaching you (and whoever's around!) about the wonders of CSS?

You can get the shirt right now for $24 + shipping, which will help us finance future efforts on this survey and others.

Catch Up on the State of JavaScript

Speaking of other surveys, you should check out our 2018 State of JavaScript survey results if you haven't already. We promise you'll learn a thing or two!

Screen-Shot-2019-06-11-at-7.41.36
The State of JavaScript 2018

The State of CSS on The Changelog

If you're a podcast listener, keep an eye out for my appearance on The Changelog, where I talk more about the data, address some controversies about our data collection process, and give you a behind-the-scenes look at our tech stack.

Stay Tuned

Finally, if you want to make sure you don't miss a chance to take part in upcoming survey (or know when we publish additional data), be sure to sign up for our (very infrequent) mailing list. After all the more respondents we have, the more useful our data will be!