Reputation: 327

Favicon not showing in Safari

I've searched all over the internet already and I still don't know why the favicon wont show on safari, it shows ok on chrome and FF, I've tried these in the header:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>

or this

<link rel="shortcut icon" href="favicon.ico?23189123" type="image/x-icon"/>

changed the favicon to 32 bits, or removed the WebpageIcons.db from safari library etc. and I check the website on browserstacks in case is my cache..

Is there anything else Im missing? please let me know any suggestions, thanks in advance.

Upvotes: 14

Answers (4)

Thiago Melo

Reputation: 49

For me, i had to go to the tab of my website in localhost, the click in Safari in the bar, click settings for localhost and disable content blockers

Upvotes: 0

Ken Aqshal

Reputation: 83

I faced a similar problem where the favicon wasn't appearing in Safari during the development of a Next.js project on my Ubuntu machine. I discovered a solution that addressed this issue, outlined here for local development.

Moreover, to ensure the favicon displays correctly in live environments, such as staging or production, I had to make an additional configuration. I added the attribute crossorigin="use-credentials" as recommended in this guide.

Upvotes: 0

Krishan Madushanka

Reputation: 389

Use https://favicon.io/ and generate the html code snippet and file set using your image for favicon.

Upvotes: 0

Ogbonnaya Ngwu

Reputation: 79

Safari uses "apple-touch-icon" and not just "icon". Also, you will have to specify the icon for all Apple devices if you want it to show up in all of them.

Upvotes: 7

Favicon not showing in Safari

Answers (4)

Related Questions