The CSS Zen Garden dream, finally shipped

In one line

Rebuilding Firefox.com with Mozilla and Lincoln Loop on modern, native CSS with no preprocessors, and what that means for design systems today.

Opening excerpt

Back in 2008, fresh out of college, I discovered CSS Zen Garden , Dave Shea’s project where one HTML file could be restyled into something completely different using nothing but CSS. It was a glimpse of the dream: clean, reusable design, fully separated from content.

Together we built a design system of more than 70 components and 25 page templates, implemented as Wagtail components so the site’s content team can assemble pages without engineering help. The site currently supports 19 locales.

I owe a debt to the people who shaped how I think about this craft: Nicole Sullivan , Rachel Andrew , Jen Simmons , Chris Coyier , Kasey Kelly , who connected me to the Mozilla project, and Eric Meyer , my hometown hero. Their work taught a whole generation of us to think about CSS as a system.

This is the thread running through all my work: design systems that let teams move fast and stay consistent, whether the building blocks are pure CSS, Tailwind, or shadcn/ui. The tools change every few years.

(Excerpted from the original; full article via the source link below.)

This story hit the Hacker News front page today (107 points / 47 comments, via josprague.com). Our Tech Radar aggregates daily signals on AI engineering, backend architecture and DevOps — browse the related services and further reading below, or get in touch with our team.