Favicon & App Icon Generator
Drop an image, get every favicon size you need. ICO for legacy browsers, PNGs for modern sites, app icons for iOS and Android, plus a web app manifest. All generated in your browser — nothing uploaded.
What you get
One source image, many output files. This favicon generator produces every size and format a modern website, web app, or progressive web app needs — all from a single upload.
ICO file (16x16, 32x32, 48x48) — the classic multi-resolution favicon that every browser has supported since Internet Explorer 6. Still the file browsers request by default when you type a URL.
PNG icons at 16x16, 32x32, 48x48, 64x64, 180x180, 192x192, and 512x512 — covering browser tabs, bookmark thumbnails, Android home screens, and the large icon the Chrome Web Store and PWA install prompts require.
Apple touch icon at 180x180 — the size iOS expects when a visitor adds your site to their home screen. Without it, Safari falls back to a tiny screenshot of the page.
A web app manifest (manifest.webmanifest) with the correct icon entries, ready to drop into your site root. This is what makes your site installable as a PWA on Android and Chrome desktop.
HTML snippet with every link and meta tag you need — paste it into your head and you are done.
Why each size matters
Browser tabs show your favicon at 16x16 or 32x32. On a retina display that 16-pixel icon is rendered from a 32-pixel source, so if you only supply a 16x16 PNG it looks blurry on every high-DPI screen. Supplying both sizes means crisp icons everywhere.
Bookmarks and speed-dial tiles use larger icons — 48x48 and 64x64. A favicon that looks fine in a tab can become an unrecognisable smear when blown up to a bookmark thumbnail. This app icon maker generates the larger sizes so those contexts stay sharp.
Android home screen icons and PWA install prompts want 192x192 at minimum, with 512x512 needed for the Chrome Web Store and some launcher themes. Without these, your site installs with a generic grey placeholder — which looks broken even if the site itself is polished.
iOS does not read the web app manifest. It uses apple-touch-icon at 180x180 (for 3x retina iPhone and iPad). This is a separate tag and a separate file, and this favicon generator creates both.
The ICO file bundles 16, 32, and 48 into one file because that is what browsers expect when they request /favicon.ico without a size hint. Skipping the ICO means legacy browsers and some CMS platforms show nothing at all.
How to use the generated files
Upload the ICO file (or the individual PNGs) to your site root. Most platforms — WordPress, Shopify, Squarespace, Netlify, Vercel — have a favicon upload setting that places the file in the right location automatically.
Paste the generated HTML snippet into the <head> of every page, or into your site template if you use one. The snippet includes the ICO link, the individual PNG links for modern browsers, the apple-touch-icon tag, and the manifest link.
Upload manifest.webmanifest to your site root alongside the icon files. The manifest references the 192x192 and 512x512 PNGs, so make sure those files are in the same directory. This is what enables PWA installation on Android.
For iOS home screen support, the apple-touch-icon.png must be at the path referenced in the HTML snippet. If your platform's favicon uploader places files in a subdirectory, update the href in the snippet to match.
If you already have a manifest.json, merge the icons array from the generated manifest into your existing one rather than replacing it — you may have other manifest entries (theme_color, display mode, start_url) you want to keep.
Privacy promise — everything runs in your browser
This favicon generator processes your image entirely on your device. The source image is read by a canvas element, resized in memory, and encoded to ICO and PNG formats — all within the browser tab. Nothing is uploaded to any server at any point.
Disconnect from the internet after the page loads and the tool still works. The service worker precaches the entire application shell, so you can generate favicons offline.
That matters because the image you are converting might be a logo, a brand mark, or an unreleased design. Uploading it to a random favicon generator on the internet means handing that file to whoever operates the server. This tool removes that risk entirely.
There is no account, no email collection, no watermark, and no file retention — because there is no server to retain anything.
Tips for the best favicon
Start with a square image. If your source is not square, the generator crops to the centre — so compose your logo accordingly, or crop it first using the image converter.
Simple designs work best. A favicon is viewed at 16x16 pixels in a browser tab, which means fine detail disappears. A bold shape with one or two colours reads clearly at every size; a detailed illustration becomes a muddy blob.
PNG with transparency is the best source format. The generator preserves transparency across all output sizes, which means your favicon can sit cleanly on any browser tab colour — including dark mode tabs.
Test at small sizes before committing. Zoom out to 16x16 and check whether the icon is still recognisable. If it is not, simplify the design — that is the whole point of generating all the sizes together, so you can see the problem before deploying.
Quick questions
What is a favicon and why do I need one?
A favicon is the small icon shown in browser tabs, bookmark lists, and history menus. Without one, browsers show a generic blank page icon. A custom favicon makes your site recognisable and professional — and it takes seconds to generate with this tool.
What sizes does this favicon generator create?
ICO (16x16, 32x32, 48x48 bundled), PNG at 16, 32, 48, 64, 180, 192, and 512 pixels, plus an Apple touch icon at 180x180. That covers every browser, every OS, and every PWA install prompt.
Do I need all these sizes?
The ICO and the 192x192 PNG are the minimum for a modern site. The ICO handles legacy browsers and the default /favicon.ico request; the 192x192 PNG is what the web app manifest references for Android home screens and PWA installs. The rest polish the experience on retina displays, bookmarks, and iOS.
What is a web app manifest and do I need one?
A web app manifest is a JSON file that tells browsers how your site should behave when installed as a PWA — including which icon to show. If you want your site to be installable on Android or Chrome desktop, you need one. This favicon generator creates it for you automatically.
Can I use a non-square image?
Yes, but the generator crops to the centre to make a square. For best results, start with a square source image or crop your logo first. A rectangular image will lose its left or right edges in the favicon.
Are my images uploaded to a server?
No. This favicon generator runs entirely in your browser. Your image is decoded, resized, and encoded locally. Nothing leaves your device — disconnect from the internet and it still works.
What image formats can I use as input?
PNG, JPG, WebP, and SVG. PNG with transparency gives the best results because the generator preserves transparency across all output sizes.
How do I add the favicon to my website?
Upload the generated files to your site root, then paste the HTML snippet into your page's <head>. Most CMS platforms (WordPress, Shopify, Squarespace) also have a favicon upload setting that handles file placement automatically.