Change The Color Of The Firefox Scrollbar - gHacks Tech News

Change The Color Of The Firefox Scrollbar

The Firefox web browser displays a vertical or horizontal scrollbar at the right and lower edge of the browser whenever the page contents cannot be displayed all at once in the browser window. And while it is clearly visible on most web pages, users may encounter pages where the scrollbar is barely distinguishable from the page contents.

Firefox users who have installed a new theme in the browser may also notice that the initial scrollbar design might not be that fitting for the selected theme.

The New Scrollbars add-on for the Firefox web browser offers to replace the default scrollbar with another one. It ships with a total of seven scrollbar colors that are made available for themes with light and dark backgrounds, bringing the overall total of available custom scrollbars to 14.

Firefox users will notice the new scrollbar color immediately after installation of the add-on and restart of the browser. All selectable scrollbars offer a better contrast than the original Firefox scrollbar.

firefox scrollbar colors

The scrollbar design has been changed as well, rounded corners are now displayed at the top and bottom of the scrollbar to visualize the beginning and end of it.

Keep in mind that you may need to reload pages after installation or selection of a different scrollbar color scheme. Open the options of the New Scrollbar add-on to change the scrollbar and background color.

new scrollbar firefox

The easiest way to get there is to enter about:addons in the address bar which opens the list of installed add-ons. Click on the options button next to the New Scrollbar add-on to open the extension's configuration menu.

A light (v1) and dark (v2) background is available for every selectable scrollbar color. You can furthermore use the settings to change the width of the scrollbars in Firefox from 13 pixels to 17. For that you need to select the Off option first. This displays both widths as tabs.

Firefox users who want to change the default browser scrollbar will find the NewScrollbar add-on ideal for that purpose. The add-on can be downloaded from the official Mozilla Firefox add-on repository.


We need your help

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:

Previous Post: «
Next Post: »


  1. vasa1 said on January 3, 2012 at 7:19 pm

    It’s possible to tweak scrollbars if one has the Stylish extension installed. This is what I currently use:
    scrollbar { -moz-appearance: none !important; background: #333 !important}
    scrollbar[orient=”vertical”] { width: 7px !important}
    scrollbar[orient=”horizontal”] { height: 7px !important}
    scrollbar thumb {
    -moz-appearance: none !important;
    -moz-border-radius: 4px !important;
    background: #300000 !important;
    min-width: 8px !important;
    max-width: 8px !important;
    border: 1px !important;

    scrollbarbutton { display: none !important}

    More styles are available at

    1. Martin Brinkmann said on January 3, 2012 at 7:24 pm

      Vasa, great tip, thanks for posting.

  2. jay said on January 4, 2012 at 1:13 am

    Could you pleeease tell me how you made your firefox look like that i installed stratiform and tweaked it alot to make it look exactly like your’s and im on vista btw and also thanks for this newscrollbars looks lovely :)

    1. Martin Brinkmann said on January 4, 2012 at 1:50 am

      Jay that is just the standard theme with the Tiny Menu add-on installed.

  3. Swamykant said on January 4, 2012 at 8:52 am

    Now the scroll bar looks cool. Thanks for the tips.

  4. WebHybrid said on March 17, 2012 at 1:31 am

    I like this [nonessential] appearance enhancement – have used it since its first version and have had no trouble with any incarnation of it (even though my Firefox theme is highly customized). Nice!

Leave a Reply

Check the box to consent to your data being stored in line with the guidelines set out in our privacy policy

Please note that your comment may not appear immediately after you post it.

Be polite: we do not allow comments that threaten or harass, or are personal attacks. Please leave politics and religion out of discussions!