What the tool does
The favicon generator creates PNG icons, favicon.ico, site.webmanifest, and an HTML snippet for linking the assets. You can choose background, padding, and crop mode.
How to use it
- Upload a square or nearly square logo.
- Set background, padding, crop mode, and app name.
- Download the ZIP and place the files in your site root.
What the favicon package includes
The ZIP contains favicon.ico for classic browsers, PNG icons at 16, 32, 48, 180, 192, and 512 pixels, a site.webmanifest file, and an HTML snippet for linking the assets. This covers browser tabs, bookmarks, iOS home screen icons, and Android/PWA icons.
favicon.ico is built from several PNG sizes so old and modern browsers can choose the right version. The 180x180 PNG is used as apple-touch-icon, while 192 and 512 pixels are referenced in the manifest for installable site icons.
Preparing the source logo
A square or nearly square logo with enough space around the mark works best. If the mark is wide or tall, use background and padding settings so it does not touch the edges of small icons.
A transparent background is useful for simple marks, but some platforms may render it differently. For a stable appearance, choose a background color and check the 192, 48, and 32 pixel previews before downloading.
Installing files on a site
In most projects, the files from the ZIP go into the site root next to /favicon.ico, and the HTML snippet goes into the head template. If your site uses a framework, place the files in the public directory that is copied without renaming.
After replacing a favicon, browsers and search engines can keep showing the old icon from cache. Check the page in a private window, refresh cache, and allow time for recrawling if the icon was already published.