What this favicon generator does
Use one image to generate favicon files, a site.webmanifest, and HTML for your page's <head>. The page lists JPG, PNG, WEBP, GIF, BMP, and SVG in the upload area. Processing is described on the page as local in your browser.
How to generate a favicon package
- Drop an image into the upload area, or click browse files.
- Choose Crop to fill to crop a non-square image to a centered square, or Fit with padding to scale the whole image inside the square with a small safe margin.
- Under Background, choose Transparent, White, or a custom color.
- Set Site name (used in manifest & preview) and Theme color.
- Review the source thumbnail, browser-tab preview, and size preview grid.
- Click Download favicon package (.zip). If needed, copy the generated text from HTML to paste in <head> and site.webmanifest using their copy controls.
Generated files
- favicon.ico - a file containing 16, 32, and 48px versions.
- favicon-16x16.png and favicon-32x32.png - standalone PNG files.
- apple-touch-icon.png - a 180px PNG file.
- android-chrome-192x192.png and android-chrome-512x512.png - PNG files referenced by the manifest.
- site.webmanifest - the generated web manifest file.
- The generated HTML snippet with link tags for the listed files.
Choose fit and background settings
Crop to fill centers a non-square image and crops it to a square. Fit with padding keeps the complete image visible inside the square. Use Transparent to keep transparency, or choose White or a custom color to fill the background before the icon is drawn.
Review and use the generated files
The package includes favicon.ico with 16, 32, and 48px versions; favicon-16x16.png; favicon-32x32.png; apple-touch-icon.png at 180px; android-chrome-192x192.png; android-chrome-512x512.png; and site.webmanifest. The page also generates an HTML snippet with link tags for these files.
Use the browser-tab preview and size preview grid to check the result. The preview areas are for review; they are not separate download controls. Place downloaded files where the generated HTML expects them, then add that HTML to the page's <head>.
Limitations and troubleshooting
- The page does not document browser compatibility, maximum image dimensions, maximum file size, or animated GIF behavior.
- The readable page source does not document the error shown for an invalid file, an image that cannot be decoded, or another generation failure. These cases are therefore not specified here.
- Click Replace image to clear the current image, previews, generated text, and download state before loading another image.
Frequently asked questions
What files does this favicon generator create?
It creates favicon.ico with 16, 32, and 48px versions; favicon-16x16.png; favicon-32x32.png; apple-touch-icon.png at 180px; android-chrome-192x192.png; android-chrome-512x512.png; site.webmanifest; and an HTML snippet with link tags for the generated files.
What happens to transparent backgrounds?
With Transparent selected, transparency is kept in the generated sizes. Selecting White or a custom color fills the background before the icon is drawn.