F.A.Q.

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.