The CSS Zen Garden dream shipped
10 hours ago
- The CSS Zen Garden dream, once theoretical, is now achievable in production after nearly two decades of browser and specification evolution.
- Modern CSS (custom properties, Grid, Flexbox) eliminates the need for preprocessors and hacks, enabling clean separation of design and content.
- The Firefox.com rebuild used pure, native CSS with no preprocessors, leveraging custom properties exported directly from design files and supporting 70+ components and 25 page templates.
- PostCSS was used only for inlining @import statements to improve performance, without altering the authored CSS which remains plain and browser-native.
- The project demonstrates that the web platform is ready for native CSS design systems, with consistent browser support and minimal legacy fallbacks.
- A clear distinction is made between 'no build step' and 'build step only for optimization', emphasizing that source code should be the language the browser speaks.