Italicize Unread Tabs in Firefox 3

I suffer from “tabulitis” – as I read a web page I open a new tab for every link I want to follow later. Keeping track is a pain. There is a solution that worked fine for me on Firefox 2 on Windows, but now that I am enjoying Mac OS X and Firefox 3… I had to take matters into my own hands.

All I wanted to do was go from this:

all tabs are straight!

BEFORE: all tabs are straight!

To this:

AFTER: compare 'Personas' and 'Window' tabs!

After some semi-random fiddling with the two closest solutions I came across the winning combination of parameters.

The easiest way to make it work is to install Stylish add-on for Firefox: it allows you to add pieces of custom CSS to FireFox UI. There is a whole vibrant community of people who have put together nice little snippets that will make your favorite browser (or your favorite site) look more… stylish. Installing one of the snippets is as easy as clicking on it!

I have uploaded mine here. Just click on the “Load into Stylish” button (Stylish must be already installed), and you should be done.

While you are on the site, check out very relevant and possibly superior work by Gina Trapani and Roblesolido.

For those who would rather edit their userChrome.css than add yet another plugin, the following lines should do the trick:

@namespace url(;
/* ==UserStyle==
// @name         Italicize Unread Tabs (Mac OS X, maybe others)
// @author       andrabr
// @description	 Unviewed tabs have title (on the tab) in italics. Tested on Mac OS 10.5.4
// ==/UserStyle==*/

.tabbrowser-tab:not([selected]) .tab-text,
font-style: italic !important;

I am going to see if I can easily wrap it into a Firefox plugin for even more straightforward consumption, but no promises yet.

Please keep in mind: this has been tested on Firefox 3 on Mac OS 10.5.4 – your environment might be different.



About this entry