Classic Extensions: Stylish

Add-ons, and extensions in particular are pretty much what put Firefox in a class of its own when it comes to web browsers comparison.

Among the thousands of extensions there are some very notables that have become classics on their own right. An example of these is Stylish.

userContent.css and userChrome.css, are two files located in Firefox profile folder, that let you customize how any web site and Firefox itself look ,respectively, by defining CSS rules. The problem is: you have to know how to define a rule (CSS), what to modify, where to find the files, then restart to see if it works. While (fortunately) this is fun for a few users, for a vast majority it is a barrier.

Enter Stylish, created by Jason Barnabe.

For the enthusiast, it eases the development of such re-stylings providing tools to manage styles, enable and disable them without requiring restarts, coding hints, and even a cool data URL generator that allows including files (images usually) as part of the restyling.

But most importantly it provides a dead simple way to acquire some of thousands of styles that other users have created from userstyles.org, a huge repository you can browse (and preview in most cases).

When you find one that you would like to try, just press Load into Stylish.

You will be asked for confirmation.

You can choose to Save it (an enable it) or first preview what it does. If the style is for a specific page, you will have to switch to a page in that domain to see the effect. If you are satisfied then press Save.

You can manage your styles by clicking on the status bar icon and selecting Manage Styles…

Here you can enable or disable, delete or edit them. As you see in the screenshot, it also shows what each one modifies: Firefox user interface or a specific site.

In brief, a powerful extension that takes the complexity out of Firefox’s customization power.

Stylish is available from Mozilla Add-ons.