What are the differences between different Mozilla design systems and projects?
We have a long history with a lot of similar sounding projects, and systems. Here is a list of names and their purposes that you may have heard around Mozilla.
Acorn [design system]
Acorn is the design system that documents Firefox’s design as it is today. Acorn is public facing.
Proton [design refresh/UI redesign]
Project name of the UI redesign of Firefox from V89.
Photon [design system]
Our previous, now deprecated, design system that documented UI from before V89. It is no longer in use and was replaced by Acorn.
Protocol [design system]
A design system for Mozilla and Firefox websites. Currently it’s used primarily by the Mozilla Marketing Websites team as the front-end for mozilla.org. Protocol is public facing.
Nebula [design system]
A private design system for Privacy and Security products.
Mozilla.design [style guide]
Brand guidelines for Firefox and Mozilla.
Firefox Account [style guide]
Style guide for Firefox accounts.
Design.firefox.com [website]
Former landing page for different resources Photon, Photon Icons Repository, UX Blog, Design Values… Now it redirects to Acorn.
If you have a question not answered here, please reach out to the Acorn team.