A minimalist userChrome.css

February 21, 2026 ยท View on GitHub

userChrome.css is a Firefox configuration file which allows the user to define his own look of the browser.

This particular config works best with a minimalist WM like dwm, xmonad or awesome.

How to use

Enable user chrome:

  1. in about:config set toolkit.legacyUserProfileCustomizations.stylesheets to true

Enable compact mode:

  1. in about:config set browser.compactmode.show to true
  2. in the customize toolbar menu set density to compact

Via the customize toolbar menu remove firefox view (the top-left corner icon)

Enable dark theme in settings.

Copy userChrome.css to the chrome directory in your firefox profile. If there is no such directory create it.

If you're unsure what the path to your profile's directory is, you can find out by going to about:profiles.

Then either install the DejaVu Sans Mono font, or change the relevant line of userChrome.css (search for 'DejaVu Sans Mono') to some other font that you have installed. This affects the urlbar font.

Optionally install tridactyl or a similar extension for best results.

Color of text in a tab is determined by its container. If a tab has no container, fallback colors are used. You can change the basic colorscheme by adjusting values of variables defined at the top of userChrome.css.

Screenshots

With navbar shown:

Common issues

black stripe under tab bar

Increase the value of the --tab-min-height variable in userChrome.css.

I want to enable favicons

Search for 'disable favicons' and comment the relevant line.

I want to disable tab numbers

Delete code under the comment line which reads numbering tabs.

Credit

This userchrome is a fork of aadilayub's.