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. 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
- Firefox Send
- Stack Overflow’s Stacks design system
- Heroku switched from a BEM approach to a utility-first approach in the latest version of their design system
- Laravel Spark, Laracasts, Laracon AU
- Pizza Hut (UK)
- National Basketball Association (N. America)
- Blizzard / Diablo 4
- Gearbox / Borderlands 3
- Stephen Hawking
- Clearbit’s Salesforce landing page
- 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)