Favicon showing up locally/deploy preview but not in prod

Hello all,

This is my site

When I am locally testing my site, my favicon appears and when I deploy to Netlify, the deploy preview also shows the favicon perfectly fine. But when I publish and deploy my site officially, the favicon disappears.

I have my favicon in my root project folder as “favicon.ico” and I also see it when downloading a copy of my production build, so it’s definitely there. In the head of my HTML file I have these two lines:

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

And this is the structure of my project locally:

I was thinking it could be an issue with it being in the public folder locally, but I’ve tried adding “%PUBLIC_URL%” before the favicon path in my html head element, and that didn’t work either.

Could this be a React-related issue with the way my project is structured? I followed a tutorial to build my site so I’m not super familiar with using React.

I have looked at all other posts on here and have tried the solutions people offered. Cleared my cache, and even tried loading my site from a different browser and incognito, but alas, nothing.

(Also, I am using manual deployment with the Netlify CLI if this info helps at all)

Any help would be much appreciated!

@keibrdn I see your favicon :slightly_smiling_face:


It doesn’t seem to be a standard size though, so that may be contributing to it not showing in some circumstances. There are various checks that you can use online to check compatibility etc.

I see, thank you for the resource! I’ve also had a friend tell me they see it as well. I’ll fix the sizing and hopefully that will let it show up on my end. Thanks!