We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

How to set homepage favicon for my site?

more options

The bookmark and tabs show my favicon but the firefox empty landing page does not show my favicon. Instead it shows a generated icon...

What do I need to do to make favicon show?

I have this in my head

``` <link rel="icon" href="/static/favicon.png" /> <link rel="apple-touch-icon" sizes="128x128" href="/static/favicon.png" /> <link rel="manifest" href="/static/manifest.json" crossorigin="use-credentials" /> <link rel="shortcut icon" type="image/png" href="https://fuckedweb3.com/static/favicon.png" /> <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon.png" /> <link rel="image/x-icon" size="32x32" type="image/x-icon" href="/favicon.ico" /> ```

The bookmark and tabs show my favicon but the firefox empty landing page does not show my favicon. Instead it shows a generated icon... What do I need to do to make favicon show? I have this in my head ``` <link rel="icon" href="/static/favicon.png" /> <link rel="apple-touch-icon" sizes="128x128" href="/static/favicon.png" /> <link rel="manifest" href="/static/manifest.json" crossorigin="use-credentials" /> <link rel="shortcut icon" type="image/png" href="https://fuckedweb3.com/static/favicon.png" /> <link rel="icon" type="image/png" sizes="32x32" href="/static/favicon.png" /> <link rel="image/x-icon" size="32x32" type="image/x-icon" href="/favicon.ico" /> ```

All Replies (1)

more options

What do you mean by "the firefox empty landing page"?

If you mean the Shortcuts section of the built-in Firefox Home page (about:home or about:newtab):

Firefox prefers a 256x256 icon for the shortcut icon. Example:

<link rel="icon" type="image/png" sizes="256x256" href="https://www.userchrome.org/img/Fxcss_256.png">

I think it might help to list that one last.

That said, I often see Firefox show a pixelated version of the classic small icon on a white box, so that shouldn't really be necessary.