A favicon is the small image that represents your site in a browser tab, a bookmark list, a search result, and a phone home screen. One file is no longer enough, because those contexts want different sizes and a browser that has to scale a single image down to 16 pixels does a visibly poor job of it.

This tool takes one source image and produces the set that actually matters: 16 and 32 pixel icons for browser tabs and bookmarks, 180 pixels for the Apple touch icon used when someone adds your site to an iOS home screen, and 192 and 512 pixel icons for Android and for the web app manifest. Each one is resized separately from your original, so small sizes stay crisp instead of being a blurry downscale of a large image.

Two details are worth getting right before you upload. Use a square source image, ideally 512 pixels or larger, because anything non-square has to be padded or cropped. And keep the design simple: a favicon is often rendered at 16 pixels, where fine detail, thin strokes and small text turn to mush. A single letter, a simple mark, or a bold shape reads at that size; a detailed logo does not.

It is also worth remembering that search engines have their own requirements. Google looks for a square icon, prefers a multiple of 48 pixels, and will simply ignore one it considers unusable, which is a common reason a site shows a generic globe next to its search result rather than its own mark.

Along with the images you get the HTML link tags and a web manifest snippet, so there is no guessing about which attributes each icon needs.