How to easily generate favicons
Oct 30, 2024. 160 words. 1 minute. webdev
tl;dr:The easiest way imaginable to create a favicon and set it up correctly.
Sometimes I need to add a favicon to a website. Many years ago this came down to
dropping a favicon.ico into the root folder and be done with it. Today however,
with different platforms and some mobile-specific things like homescreen icons,
there is more to it.
While checking how to do this correctly for a Hugo website, I came upon this great website: RealFaviconGenerator. It does exactly, what it says on the cover. You upload the icon and then get asked a few questions. A nice preview shows you how it will look in the Google search results, on the iOS homescreen, and on Android.
In the end, you can download the full set of files that are needed along with a
small HTML <head> snippet that sets up everything correctly. As a bonus, they
also have a small tool to check an existing website.
Really nice little tool, no registration needed, works in a few simple steps, definitely recommended!