Skip to content

TinyRaindrop/Firefox-UI-customization

Repository files navigation

Firefox UI customization

Changing Firefox interface with userChrome.css and userContent.css.

Latest update was for version 78.0b4.

Features

  • centered address in urlbar
  • floating centered findbar on the top of the page
  • subtle tab separators
  • tab close button visible only on hover
  • unnecessary buttons removed
  • context menus cleaned up
  • dark thin scrollbars
  • dark JS alerts/prompts
  • dark viewsource and error pages
  • bookmarks bar on newtab page on hover
  • background image on newtab page
  • floating navbar in fullscreen mode
  • compact addons overflow menu

Some colors might be hardcoded to match the theme I use (ArcDark).

Installation

  1. Open your profile from about:support > Profile Folder.
  2. Inside create a folder named chrome.
  3. Copy contents of this repository into this chrome folder.

Comment out @import lines in userChrome.css and userContent.css to disable certain tweaks. Such as

/*@import url('userContent/about_newtab.css');*/

Examples

NewTab screenshot Photo by Osman Rana on Unsplash

Webpage screenshot

Min/max/close buttons stand out because on my Windows 8.1 they are controlled by OS and cannot be changed by Firefox.

Other great custom Firefox UI projects