DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 966,155 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Pacharapol Withayasakpunt
Pacharapol Withayasakpunt

Posted on

Why do I even need favicon to prevent server errors? And, why the default is .ico?

Do I even need /favicon.ico for http://localhost or Electron?

Right now? I use 1px PNG (not ICO) at /f/favicon.png (not at /, but at /f/). I think it is at least better than using a a short string of data URI (where Fastify Helmet or Express Helmet won't allow).

pip install pillow
python -c 'from PIL import Image;Image.new("RGBA", (1,1), color=(0,0,0,0)).save("favicon.ico", sizes=[(1,1)])'
Enter fullscreen mode Exit fullscreen mode

Top comments (2)

Collapse
 
nbilyk profile image
Nicholas Bilyk

+1 it's silly that favicon.ico is considered required.
There's also an online ico creator (heavily ad supported)
favicon.io/

I haven't seen your 1px solution before. I like it. Although isn't there also a size requirement for favicon.ico? I thought they were supposed to be 16x16 or something like that.

Collapse
 
joelbonetr profile image
JoelBonetR

favicon is meant to add information to the user about whether a browser tab or a saved URL (as desktop icon) contains. It's a good practice to have one and it needs to be placed on the root directory of your project with the name favicon.ico, because it's a web standard.

Inside your root HTML you can set up multiple icons as well, targeting specific devices like 'apple-touch-icon' or simply 'icon'.

🌚 Friends don't let friends browse without dark mode.

Sorry, it's true.