I am trying to use the pinned tab icon for my Wordpress blog and it does not appear to be working correctly. Here is the HTML tag I am using:
<link rel="mask-icon" href="website_icon.svg" color="red">I referred to the docs here: https://developer.apple.com/library/prerelease/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9.html
Here is the SVG on the site: http://www.jashsayani.com/safari-pin-icon.svg
It seems to be generating a perfect png that goes in the Template Icons folder. Safari just doesnt display it. It displays a solid square instead.
I restarted Safari and deleted the contents in the Template Icons folder, but it did not help.
Opening the web inspector shows the correct HTML tag on the site and clicking on the SVG in the source opens the path in the new tab correctly. Seems like a rendering issue on the tab (other sites like Yahoo, Facebook, etc seem to be showing correct pin icons).