Favicon Generator

Upload an image once, download every favicon size you need: browser tabs, iOS home screen, and Android/PWA icons, plus the HTML to use them.

Click to choose an image, or drag and drop it here

Square images work best. Stays on your device, nothing is uploaded.

What you get

A .zip with 16×16, 32×32, and 48×48 PNGs for browser tabs, a 180×180 apple-touch-icon for iOS home screens, and 192×192 / 512×512 PNGs for Android and PWA manifests, plus a text file with the exact <link> tags to paste into your site's <head>.

How it works

Your image is first cover-fitted: the code takes the largest centered square that fits inside it, then a single drawImage() call crops that square and scales it onto a canvas of the target size in one step, so non-square uploads come out cropped instead of stretched or letterboxed. That happens six times, once each for 16, 32, 48, 180, 192, and 512 pixels, and each canvas is exported as a PNG. The 180px one is named apple-touch-icon.png because that's the filename iOS conventions expect; the rest are favicon-NxN.png. The zip archive is assembled byte by byte in JavaScript, no server-side zipping, and includes a text file with the exact <link> tags to paste into your <head>. You may notice there's no .ico file: every current browser accepts PNG favicons, and the ICO container format's one remaining trick, bundling multiple sizes in a single file, matters mostly for legacy agents that blindly request /favicon.ico.

Which sizes actually earn their keep in 2026: 32x32 covers browser tabs on modern displays (16x16 is the legacy fallback, still worth shipping because it's tiny), 180x180 is what iOS uses for home screen bookmarks, and 192x192 plus 512x512 are the two sizes the PWA manifest spec requires for install prompts and splash screens. The 48x48 mainly serves Windows and some search result treatments. Practical advice the file sizes won't tell you: an icon that looks great at 512px usually turns to mush at 16px, so favor one bold shape and high contrast over detail. If your logo has fine lines, test the 16px preview above before shipping.

The image you drop in is decoded, cropped, resized, and zipped entirely in your browser's memory; there is no upload endpoint in this page at all. Watch the DevTools Network tab while you generate: the only transfer is the finished zip moving from memory to your downloads folder.

Common questions

Why not a .ico file?

Modern browsers, iOS, and Android all support PNG favicons directly, which is what every size in this download is. A .ico file historically bundled multiple sizes into one container, but it's no longer required, the HTML snippet included points browsers to the right PNG for each context.

What image should I upload?

A square image works best and crops cleanly. Non-square images are automatically cropped to a centered square before resizing, so the important part of your logo should be near the center.

Is my image uploaded anywhere?

No, every size is generated locally in your browser using the canvas API. Nothing is sent to a server.