/FirefoxCSS-Store.github.io

A collection site of Firefox userchrome themes, mostly from FirefoxCSS Reddit community.

Primary LanguageJavaScript

FirefoxCSS-Store


A collection site of Firefox userchrome themes, mostly from FirefoxCSS Reddit.
Preview here.


Generic Installation

  • Go to the wanted theme and click the download button.
  • You should now be on the Github page for that topic.
  • Below you should see a guide on how to install that particular theme and a few preview pictures. Anyway, here are some common steps for all themes.
  1. Download the theme with the big green button: "Code" >> Download.zip

  2. Open about:config page.

  3. A dialog will warn you, but ignore it, just do it press the I accept the risk! button.

  4. Search for these:

    • toolkit.legacyUserProfileCustomizations.stylesheets
    • layers.acceleration.force-enabled
    • gfx.webrender.all
    • gfx.webrender.enabled
    • layout.css.backdrop-filter.enabled
    • svg.context-properties.content.enabled

    Then make sure to enable them all!

  5. Go to your Firefox profile.

    • Linux - $HOME/.mozilla/firefox/XXXXXXX.default-XXXXXX/.
    • Windows - C:\Users\<USERNAME>\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXXXX.default-XXXXXX.
    • macOS - Users/<USERNAME>/Library/Application Support/Firefox/Profiles/XXXXXXX.default-XXXXXXX.
  6. Create a folder and name it chrome, then assuming that you already have cloned this repo, just copy the theme to chrome folder.

  7. Restart Firefox.


Add your theme <3

  • If you have a Github account:

    1. Fork this repository
    2. Look for a file called themes.json, open and edit it
    3. Below the last } add , right after a copy the code below and paste it in the file
    4. Add the properties of your theme: title, link, description, image and tag (Cannot be left empty)
    5. Avoid the use of escaped characters, and the order matters
    6. Please, do not use a very big image, preferably (650x500)
    7. Image property:
    • You can put an image URL
    • Or an image file in /images/themes/ (The file extension doesn't matter). And then reference it in your code with the following assets/img/themes/YOUR_FILE_NAME_WITHOUT_EXTENSION.webp
    1. Then send it as a pull request to this repository.
  • Or create an Issue:

    1. When creating an issue, you will find a template for submitting a theme. Use that one. It's easy.
  • If you have a Twitter account:

    1. Send at least the following properties: tags, title, link, description, and picture to @Neikon66.
  {
    "title": "..........",
    "link": "..........",
    "description": "..........",
    "image": "..........",
    "tags": [ "your username/name", "theme type: dark", "theme type: light", "............." ]
  }

What do you think =?

Feel free to send me any feedback via issue or my twitter @Neikon66.