Affecting SVG favicon is supported; be careful with the order of <link>s

Published: | Categories: HTML | Creative Commons BY-SA 3.0

Description

Firefox 41 has added the long-awaited support for SVG format site icons (favicons). This works fine, but you have to be careful with the order of the <link> elements for your favicon. Some popular sites, including Flickr, Pinterest, Twitter and Yelp, are known to be showing a black SVG icon on Firefox 41, which is for Safari 9’s Pinned Tabs, instead of an intended, normal colored favicon. This conflict is occurring because those sites are putting the black icon after the other icons, and Firefox uses the last icon specified in the HTML source. The workaround here is, obviously, putting a black SVG icon for Safari before other icons, as recommended by Apple.

References