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, 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.

8 thoughts on “Classic Extensions: Stylish”

  1. Thanks for the review. Small mistake: you need to press “Load into Stylish” to load the file in Stylish. In your screenshot, you don’t have a “Load into Stylish” button because you’ve already installed it (hence “Style already installed in Stylish”). “Load as user script” gives you a Greasemonkey version of the style.

  2. The second screenshot is wrong. Pressing “Load as a user script” will load style in Greasemonkey, not in Stylish.
    You should click “Load into Stylish” instead.

  3. Well, i’m a long user of Stylish. But i have never come across that Wikipedia userstyle, and my God what a difference it makes!

    Thank you for such a great find.

  4. Pingback: Estensioni classiche : Stylish | Firefox Blog
  5. I maintain a comprehensive tutorial for userstyles with Stylish Firefox extension. This article, “Classic Extensions: Stylish”, was written at version 0.5.x of the Stylish project, and Stylish is in 1.x versions now.

Comments are closed.