Make Firefox look better on Vista

Firefox 3 introduced tighter OS integrating across all platforms, and even different Strata (Windows theme) flavors for Windows XP and Vista. However the result was not optimal and there is room to make Firefox feel more native.

Start with Glasser, an extension developed by Matthew Holder that adds Aero translucency to the whole Firefox toolbar area and not just the title bar. Strangely, after 5 months and 128 reviews averaging 5/5 starts it is still labeled as experimental, so you will need a Mozilla Add-ons account.

Second, you can make the bookmarks toolbar look like regular Vista toolbars with a glossy blue effect. If you’re using Stylish, just install this user style, otherwise copy the code and paste it in your userChrome.css file (located in your profile folder).

Third, tabs and group boxes look out of place in Vista. Note the border below tabs and the incorrect background color in the group boxes titles in the screenshot below.

This style will make them look as they should:

Finally, you can remove the menu bar installing Compact Menu 2, by Millie C. After restarting, right click on a toolbar and select Customize… Add the Compact Menu button somewhere in the navigation toolbar and press Done.

Right click again on a toolbar and uncheck the Menubar to hide it. You can still access all menu actions via the Compact Menu button.

Here’s how it looks in the end.

10 thoughts on “Make Firefox look better on Vista”

  1. Pingback: Sociz 日志 » Blog Archive » Vista 下 Firefox 的细节美化
  2. Pingback: Blend Firefox in Windows Vista Looks
  3. That looks much better! Are there any plans to make the integration with Vista more tighter without resorting to these great extensions?

    Also… Is there something I can add to my userchrome file to make the tab-close button appear on the correct (left) side of the tab on OS X?

      1. Thanks Martin!

        I was lucky enough to stumble across this fix – all I had to do was open the userchrome.css file in my profile/chrome folder and add this text:

        /* Close tab button on left*/

        .tab-image-middle, .tab-image-right {
        -moz-box-ordinal-group: 2 !important;
        }

        .tab-image-middle {
        padding-left: .5em !important;
        }

        .tab-image-middle, .tab-image-right {
        -moz-box-ordinal-group: 2 !important;
        }

        .tab-image-middle {
        padding-left: .5em !important;
        }

        .tab-close-button {
        display: -moz-box !important;
        }

        Now the close tab button sits where it should!

  4. It does look better, but I would like to advice some stuff.

    Instead of style 7993 on Userstyles.org you could download the Glasser extras zip package with UserChrome files from 6XGate’s MozillaZine thread at http://forums.mozillazine.org/viewtopic.php?t=649449 and use the applet’s bar style (either on UserChrome or Stylish). Why? Because the style you show uses a background image and his styles use system native toolbars that are used in other places like Windows Mail and Windows Media Player. Unfortunately the Aqua toolbar uses background images too because that toolbar appearance wasn’t implemented on Firefox CSS options.

    Beyond that I do like how style 7019 makes tabpanels look more native, but I would like to see an alternative that used real system native appearances and colors instead of hard coded colors and borders. A simple way to do that may be with margins. I already managed to make the browser tabbar use the tabpanel theme used on the options panel natively and without bugs, but I seem not to be able to make it work on the other tabpanels for some reason, so for the meanwhile it will have to be that style.

  5. Pingback: Get Firefox to look good in Vista | lab209
  6. Pingback: Vista 下 Firefox 的细节美化 | IT News RSS
  7. When you need to make changes to a style, like Mr Lizard, and PTMBlogger were discussing here, you can use Stylish Firefox extension to override the existing style, using the principles of CSS Selector Specificty ( http://honestlyillustrated.com/userstyles/stylishguide/#specificity ), without needing to change the original userstyle.

Comments are closed.