Firefox users have lots of options to customize the web browser, and in particular the interface of it. From using the integrated customize options available to them over installing extensions such as Classic Theme Restorer to custom CSS code that can modify the interface of the browser.
And those adventurous and knowledgeable enough can build their own version of Firefox from Open Source code if they so desire.
Adding CSS code to the userChrome.css file is one of the most popular options, likely because it can be done without having to install yet another extension to the browser.
It is likely that most Firefox users are not aware of the possibility, as it is not advertised by Mozilla and requires some knowledge of CSS to begin with.
Basically, to come up with your own modifications, you need to look up interface IDs of the browser that you modify with CSS code (or use the built-in Browser Toolbox for that). This code needs to be placed in the userChrome.css file that you find in the Chrome folder of the Firefox profile folder. It may not exist by default (both the Chrome folder and the file), so that you may have to create it.
Generic CSS Loader 2 improves that process. While it does not change anything in regards to coming up with the style changes, it enables you to paste them directly in a small window of the browser. So, no more opening the profile folder to add the information to it there.
What's also interesting is that it comes with a preview button that you can use for easier testing of new code.
This works for code that you write yourself, but also for code that you find elsewhere, as you can simply paste it into the form the extension provides to run it in the browser.
Another interesting feature is the ability to add theme specific code. Instead of running code globally, CSS code that you add here will only be executed if the selected theme is enabled. If it is not, it will be ignored. Useful if you want to make modifications to a Firefox theme that you have installed.
Code can also be unloaded in the browser, which is excellent for testing purposes.
The author has added the launcher to the Web Developer Tools menu. Press Alt to bring up the menubar, and select Tools > Web Developer > Generic CSS Loader from the menu. Or, use the keyboard shortcut Ctrl-Alt-/ for that.
If you work with userChrome.css code regularly, or simply want an easier way to enter it, then you may want to try out Generic CSS Loader 2 as it simplifies the process.
Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.
We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats or subscription fees.
If you like our content, and would like to help, please consider making a contribution:
Ghacks is a technology news blog that was founded in 2005 by Martin Brinkmann. It has since then become one of the most popular tech news sites on the Internet with five authors and regular contributions from freelance writers.