James E. Lee's Blog

What?

Change the color of the active tab in Firefox to improve its visibility.

By default, the active tab in Firefox is not very visible, and it becomes less so the more tabs you open in a single browser window.

Why?

Changing the color of the active tab makes it easy to see at a glance.

Firefox's tabbed browsing makes it easy to manage having several websites open at once, but with multiple tabs open, it doesn't take long to lose sight of the active tab.  Spending time looking for the active tab reduces the benefit of using multiple tabs. Changing the active tab's color solves the problem by making it stand out in the crowd.

Before

After

How?

Make a quick change to your userChrome.css file, then restart Firefox

/* Change color of ACTIVE tab */
tab
{
    -moz-appearance: none !important;
}
tab[selected="true"]
{
    background-color: rgb(255, 106, 106) !important;
    color: black !important;
}
/* Change color of normal tabs */
tab:not([selected="true"])
{
    background-color: rgb( 70, 130, 180) !important;
    color: white !important;
}

The colors in the example code above will make your tabs the same colors as mine in the screenshot above; you can use any colors you like.

Note:  You must restart Firefox for this change to take effect.

Reference

• Firefox Help: Tips & Tricks - Make the active tab easier to distinguish