• Stars
    star
    273
  • Rank 150,780 (Top 3 %)
  • Language SCSS
  • License
    Mozilla Public Li...
  • Created over 7 years ago
  • Updated about 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Firefox’s Photon Design System.

Photon Design System

This project is no longer maintained or worked on. More to come soon on our next design system documentation website.

Running Photon

Requires:

  • docker

To run (with hot-reloading!):

  • First, check out this repository into a folder.
  • Go to your command line, enter that folder, and run the following commands:
docker pull praqma/gh-pages
docker run --name photon -d -v $PWD/jekyll:/home/jenkins -p 4000:4000 praqma/gh-pages || docker start photon
docker exec -it photon jekyll serve --watch --host=0.0.0.0

Once you have something you like, it's time to share it with the rest of us!

To get your changes merged:

  • Make sure you're working on master, and submit the pull request to there.
  • Make your pull request as small as possible (so it's easier to review and merge them).
  • If it's something that needs to be merged as soon as possible, add a tag (e.g. urgent).

More Repositories

1

design-tokens

A place we used to store decisions we make. Check https://github.com/firefoxux/photon-colors for up-to-date stuff.
JavaScript
103
star
2

icons

SVG icons used in Firefox. View all icons here:
JavaScript
49
star
3

photon-components-web

INACTIVE - http://mzl.la/ghe-archive - Photon versions of the some common WebComponents
JavaScript
29
star
4

photon-icons

The design tokens for the Photon icons
JavaScript
23
star
5

firefoxUX.github.io

Firefox Design Hub
CSS
22
star
6

photon-colors

INACTIVE - http://mzl.la/ghe-archive - The design tokens for the Photon color scheme
JavaScript
20
star
7

StyleGuide

INACTIVE - http://mzl.la/ghe-archive - A style guide for Firefox.
HTML
12
star
8

people

INACTIVE - http://mzl.la/ghe-archive - A place for stuff that was on people-mozilla.
HTML
11
star
9

product-identity

INACTIVE - http://mzl.la/ghe-archive - A place to store new icons and stuff.
Shell
10
star
10

photon-extension-kit

INACTIVE - http://mzl.la/ghe-archive - Photon styles for your brand new browser extension
CSS
10
star
11

acorn-icons

This repo contains icons used throughout Firefox on Desktop and Mobile.
9
star
12

firefox-desktop-components

Testing Storybook.
Shell
5
star
13

photon-themes

INACTIVE - http://mzl.la/ghe-archive - A place for NPM modules that implement the design system on various frameworks.
CSS
5
star
14

photon-library

INACTIVE - http://mzl.la/ghe-archive - For managing the Photon Sketch.app libraries
4
star
15

create-theme-script

Creates theme files from Figma exports
JavaScript
4
star
16

values

INACTIVE - http://mzl.la/ghe-archive - Firefox Design Values.
HTML
3
star
17

firefox-design-systems

Our future website
Svelte
2
star
18

acorn-newsletters

This repository contains a history of our newsletters and their related assets.
HTML
2
star
19

firefox-design-systems-api

Firefox Design Systems API
JavaScript
1
star
20

tv-prototype

INACTIVE - http://mzl.la/ghe-archive - Prototypes for some TV interactions
CSS
1
star
21

recomp-metrics

Metrics for the Reusable Components project, forked from projectfluent/arewefluentyet.com
Python
1
star
22

settings-prototype

Prototype for the Firefox settings redesign
Svelte
1
star