Jump to content

SVG icon formatting issues

Go to solution Solved by Stuart Silvester,

Recommended Posts

After failing tests at https://www.validbot.com/ for my site's SVG icon I had an exchange with a tech person there who said:

For the SVG icon, I could not find a link tag in your page header with the format: <link rel="icon" href="/icon.svg" type="image/svg+xml"> This header is required for SVG favicons to work in browsers and for our tests to discover it.

In the standard ISP version it has:

  • rel="mask-icon" but it should be rel="mask"
  • and this is missing: type="image/svg+xml"
Link to comment
Share on other sites

In the ACP under Web App you can add a Safari mask icon. The issue seems to be how the header tag for it is formatted:

<link rel="mask-icon" href="https://www.mysite.com/uploads/monthly_2023_07/SAFARI-MASK-LOGO-NEW.svg" color="#ffffff">

should be:

<link rel="icon" type="image/svg+xml" href="https://www.mysite.com/uploads/monthly_2023_07/SAFARI-MASK-LOGO-NEW.svg" color="#ffffff">


Edited by sadams101
Link to comment
Share on other sites

mask-icon is a Safari specific thing, It was originally for those MacBook Pro's that had the touch bar so they could show a single color icon. I believe Safari may use it for other things.



Link to comment
Share on other sites

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...