Favicon Generator
Drop one square image. Get a zip with the complete favicon set: favicon.ico, 16/32/180/192/512px PNGs, and a ready-to-use manifest. Plus the exact <link> tags to paste into your <head>.
Drop a square image (PNG / SVG / JPG)
Best results with 512×512 PNG or SVG — sharp edges, minimal detail
Why one favicon isn't enough anymore
In 2014, you could ship a single 16×16 favicon.ico and call it done. In 2026, browsers and operating systems pull from at least five different sizes depending on context: the browser tab (16/32), the bookmark, the iPhone home screen (180), the Android launcher (192), and PWA installation (512). Get any of them wrong and your icon shows up blurry, pixelated, or as a generic globe.
This generator outputs all of them in one go, plus a multi-image favicon.ico for older Windows browsers, a site.webmanifest file for PWA installability, and an install.html with copy-paste-ready <link> tags.
Recommended source image
- Format: SVG if you have one (renders perfectly at every size). Otherwise a 512×512 PNG.
- Padding: include 5–10% empty space around the icon — Apple's iOS rounds the corners and crops the edges.
- Detail level: a single shape or letter. Anything fine becomes invisible at 16×16.
- Contrast: the icon must work on both light and dark browser themes. Test by previewing it on a black background too.
What's in the zip
favicon.ico— multi-image (16 + 32px), works in every browser.favicon-16x16.png,favicon-32x32.png— for modern browsers.apple-touch-icon.png— 180×180 for iOS home screen.android-chrome-192x192.png,android-chrome-512x512.png— for Android and PWA.site.webmanifest— pre-filled PWA manifest.install.html— exact <link> tags to paste into <head>.
Where to install
Place every file in the root directory of your site (the same folder as your index.html). Then open install.html, copy the snippet, and paste it inside the <head> of every page (or your shared header template).