Replace Firefox Default Favicon

The new default favicon for sites that don’t have a favicon is nothing more than a dotted square. In the past it resembled a piece of paper. Here are a couple options to replace the current favicon.  Add these lines to your userChrome.css in the chrome folder within your profile folder [directions]

Firefox Logo () – rob64rock has a stylish script that will do this as well.

/* Fx branding tab Favicon on New/Blank tabs */

tab .tab-icon-image:not([src]) {
list-style-image: url(“chrome://branding/content/icon16.png”) !important;
}

#urlbar #page-proxy-favicon:not([src]) {
list-style-image: url(“chrome://branding/content/icon16.png”) !important;
}

menuitem[class="menuitem-iconic bookmark-item menuitem-with-favicon"]:not([src]) {
list-style-image: url(“chrome://branding/content/icon16.png”) !important;
}

Other Logo ()

/*Replaces the ‘new’ default Favicon */

tab .tab-icon-image:not([src]) {
list-style-image: url(“chrome://global/skin/icons/folder-item.png”) !important;
}

#urlbar #page-proxy-favicon:not([src]) {
list-style-image: url(“chrome://global/skin/icons/folder-item.png”) !important;
}

menuitem[class="menuitem-iconic bookmark-item menuitem-with-favicon"]:not([src]) {
list-style-image: url(“chrome://global/skin/icons/folder-item.png”) !important;
}

b .tab-icon-image:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}

#urlbar #page-proxy-favicon:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}

menuitem[class="menuitem-iconic bookmark-item menuitem-with-favicon"]:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}
/* Fx branding tab Favicon on New/Blank tabs */

tab .tab-icon-image:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}

#urlbar #page-proxy-favicon:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}

menuitem[class="menuitem-iconic bookmark-item menuitem-with-favicon"]:not([src]) {
   list-style-image: url("chrome://branding/content/icon16.png") !important;
}


Comments

Replace Firefox Default Favicon — 5 Comments

  1. Now that’s nice one, thanks a lot The Guru. The new default favicon was getting on my nerves, and would have gotten on my health if my Fx theme had been dark … :)

  2. Thanks, this is nice. I guess, though, there is no way to replace the dashed squares in front of bookmarks. (I would have preferred no change to one that comes across as though somebody forgot to finish what they were doing.)

    • If you have a bunch of bookmarks that haven’t updated the favicons I would give CheckPlaces a try. This add-on does a good job of updating the favicons and also vacuuming the places.sqlite file. Comes in handy when you do a sync and need to update some of the favicons. Most of the time I leave disabled and re-enable it when I need to use it.

  3. Even better. Just a transparent icon (no icon):

    tab .tab-icon-image:not([src]) {
    list-style-image: url(“chrome://global/skin/10pct_transparent_grey.png”) !important;
    }

    #urlbar #page-proxy-favicon:not([src]) {
    list-style-image: url(“chrome://global/skin/10pct_transparent_grey.png”) !important;
    }

    menuitem[class="menuitem-iconic bookmark-item menuitem-with-favicon"]:not([src]) {
    list-style-image: url(“chrome://global/skin/10pct_transparent_grey.png”) !important;
    }

  4. Pingback: More Default Favicon Choices | Firefox Extension Guru's Blog

Leave a Reply