Companies using utility-first CSS (for example, Tailwind) in production
This is a list I put together while doing research while we were considering a trial of utility-first CSS in the Drupal team at CTI Digital (and have since kept relatively up-to-date). I’ve posted the list here to make it easier to refer to in the future. If you have any organisations or websites that you think should be on this list, let me know with a Medium reaction or via Twitter.
Some people react to the suggestion of utility-first CSS with the idea that ‘it won’t scale’ or that it won’t be right for a large project, or a large team, or that it isn’t best practice, because it isn’t the traditional way of doing things.
Beyond trying it and finding out first-hand, there isn’t an easy way to address this concern, but one way is to show examples of it being used by respected organisations, especially ones that are technology-focused.
Consider that for each organisation in this list, people will have had the same debates and discussions about the merits of a utility-first approach, but their decision was to go for it.
- Solid by Buzzfeed
- Shed by TED
- Stripe’s dashboard
- Github’s Primer design system
- Medium
- Meetup (first via their Swarm design system, then via Tailwind on the Meetup homepage)
- Firefox Send
- Kickstarter
- Twitch
- Stack Overflow’s Stacks design system
- Mapbox
- Heroku switched from a BEM approach to a utility-first approach in the latest version of their design system
- Laravel Spark, Laracasts, Laracon AU
- Algolia
- Starbucks
- Pizza Hut (UK)
- National Basketball Association (N. America)
- Blizzard / Diablo 4
- Gearbox / Borderlands 3
- Stephen Hawking
- Clearbit’s Salesforce landing page
- Eurovision
- NASA’s Jet Propulsion Laboratory
- U.S. Web Design System (USWDS)
- Der Spigel (“one of continental Europe’s most influential magazines” according to The Economist)
- Clubhouse (‘the social audio app’) — I’ve included Clubhouse on this list but its inclusion doesn’t mean I support Clubhouse. The app has made very little effort to add captioning support for deaf/Deaf/hard of hearing users.
- Github CoPilot
- React beta documentation
- Percy (now acquired by Browserstack)
- Shopify Hydrogen framework, both for the marketing site and as the default styling option when using the framework
- Netflix’s Top 10 site
