HeadlinesBriefing favicon HeadlinesBriefing.com

Rebuilding Firefox.com with Native CSS

Hacker News •
×

Rebuilding Firefox.com with Mozilla and Lincoln Loop using modern, native CSS with no preprocessors, fulfilling the CSS Zen Garden dream from 2008. Back then, limited CSS properties forced reliance on hacks, server-side processing, and table-based layouts due to inconsistent browser rendering. Custom properties, Grid, and Flexbox have since closed that gap, enabling clean, reusable design systems.

The Firefox.com rebuild includes over 70 components and 25 page templates as Wagtail components, supporting 19 locales, with content teams assembling pages without engineering help. PostCSS is used only in production to inline @import statements due to performance issues, while the authored CSS remains plain, native CSS requiring no build step to be valid. The project affirms that the browser now speaks the language designers write, realizing a two-decade vision.

Key influences include Nicole Sullivan, Rachel Andrew, Jen Simmons, Chris Coyier, Kasey Kelly, and Eric Meyer, whose work shaped modern CSS thinking. The core value remains: design systems where the right choice is the easy one, and designer intent flows directly to production.