Skip to content

A Material Design-inspired userChrome.css theme for Firefox

License

Notifications You must be signed in to change notification settings

Web3HQ/MaterialFox

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MaterialFox

A Material Design-inspired userChrome.css theme for Firefox

Preview

I did not make this theme, this is only a fork of the original repo (https://github.com/muckSponge/MaterialFox) that fixes some of the issues with the newer firefox versions and adds some improvments such as bookmarks folder icon.

If you would like to support the original creator:

Buy them a coffee

What this does

Inspired by Google's Material Design and their latest Google Chrome UI, this theme turns your Firefox into a Material-styled web browser. The aim was to style the browser as closely as possible to Google Chrome, where practical.

This is a userChrome.css theme, which means you must manually add it to your Firefox profile. The theme overrides certain browser styles. Currently, only the main UI is affected (settings pages, etc. are not). More elements of the UI may be styled in the future but a broader scope becomes harder to maintain as Mozilla updates their browser code so some UI styles may be culled or redone if they become unmaintainable.

Installation

  1. Copy the chrome folder and user.js file into your Firefox profile directory. To find your profile directory, go to about:support or about:profiles.
  2. See Recommended instructions if you'd prefer a more Chrome-like experience.
  3. Restart Firefox.

Recommended instructions

Add space above tab bar:

  • Right click on toolbar -> Customize.
  • Check Drag Space checkbox.

Replicate Chrome behaviour for clipped tabs:

  • [about:config] Set browser.tabs.tabClipWidth to 83 (default is 140).

Replicate Chrome's "Not Secure" text on HTTP:

  • [about:config] Set security.insecure_connection_text.enabled to true.

Please note

  • Linux is no longer officially supported but you can give it a try – if you'd like to work on it feel free to make a PR.
  • Some customisation settings may no longer work (such as compact/touch density).
  • Some custom themes may clash with the address bar.
  • Some themes using transparency might not work.
  • Remove "Firefox View" icon as it will break everything. You can remove the icon in: More Tools -> Customize Toolbar

About

A Material Design-inspired userChrome.css theme for Firefox

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • CSS 99.3%
  • JavaScript 0.7%