Skip to content
Amin Al Hazwani edited this page Jun 1, 2017 · 11 revisions

Launch recognizable, enjoyable Firefox products & features faster.

What is the Photon Design System?

The Photon Design System provides a centralized, living source for look, feel and sound of our products to create consistent user interfaces across all Firefox products.

For Designers

Familiarize yourself with the style, motion, copy and interaction principles defined in this Design System and build your interfaces using UI components specified here.

We make it simple to contribute to a coherently designed Firefox experience thanks to resources and templates.

If you come across an interaction or component that requires a modification, or if you require new type of component, please reach out to us so that we may include it in the Design System.

For Developers

Can consolidate the Photon Design System for any questions on detailed implementation of specified components.

Use it as a source for any specifics to rely on that are unclear to you through the mockup of a designer, and if in doubt fall back to an implementation as described here.

Call out any information you miss in the Design System and we will help you get the information you need.

Help us grow our Design System

With your help we will review any new UI to ensure the Design System stays up to date, new components are added and existing ones are updated.

If you are missing information in the Design System, please file an issue for it. This can be a component you notice that is not specified or a type of information that would make your work more productive.

And if you want to help us grow the Design System further check out the getting started page of this wiki.

Clone this wiki locally