How to get better tabs in Firefox UI (on Mac)

#browsers #firefox #css

Yes, the tabs in Firefox suck, they look like pills (or buttons) and look horrible, right?

This is how I styled them to look a little more visually pleasing:

Edit /Users/<username>/Library/Application Support/Firefox/Profiles/<your profile>/chrome/userChrome.css and add the following:

Note, you should know where this file is. If you don't, Google it and come back here.



.tab-background {
    border-radius: 0 0 3px 3px !important;
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

.tabbrowser-tab:not( [selected=true] ):not( [multiselected=true] ) .tab-background {
    background-color: color-mix( in srgb, currentColor 10%, transparent);
}

I am using this theme, curious how this looks in other themes.

Also, please let me know how this works on Windowz!

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site