Favicon Generator
Generate a complete favicon set from one image — the classic favicon.ico, every modern PNG size, the Apple touch icon and a ready-to-paste site.webmanifest. It all runs in your browser, so your image is never uploaded.
How to use it
- 1Add your image
Drop a PNG, JPG, WebP or SVG onto the drop zone, or click to choose one. A square image, 512×512px or larger, works best.
- 2Get your ZIP
The full favicon package is generated instantly and downloads as favicons.zip. You can preview the result and re-download at any time.
- 3Unzip into your site
Extract the files into the root folder of your website (the same place as your index.html), so they are served from URLs like /favicon.ico.
- 4Paste the <head> snippet
Copy the provided HTML snippet into the <head> of your pages to register the icons and the web manifest.
One image in, a whole favicon package out
Browsers, phones and web apps ask for icons in a surprising number of sizes: a 16 and 32px icon for browser tabs, a 48px icon, a 180px Apple touch icon for iOS home screens, and 192 and 512px icons for installable web apps. This tool renders your image at every one of those sizes and bundles them into a single ZIP.
You also get a multi-resolution favicon.ico (16/32/48 in one file) for maximum compatibility, a site.webmanifest that wires up the PWA icons, and an HTML snippet you can paste straight into your page’s <head>.
Private by design
Your logo or artwork often is not something you want sitting on a stranger’s server. This generator draws every size on a canvas inside your own browser, so the image never leaves your device — you can even go offline after the page loads and it still works.
A square source at 512×512px or larger gives the crispest result. Non-square images are centred and fit to a square with transparent margins so nothing is cropped off.
Frequently asked questions
Are my images uploaded to a server?
No. Every size is rendered in your browser with the Canvas API and zipped locally. Your image never leaves your device — you can disconnect from the internet after the page loads and it still works.
What image should I use?
A square image works best — ideally 512×512px or larger, as a PNG or SVG. If your image is not square it is centred and fit to a square with transparent margins, and small images are upscaled (which can look a little soft).
What files are in the download?
A multi-resolution favicon.ico (16/32/48), separate PNGs at 16, 32, 48, 180, 192 and 512px, an apple-touch-icon.png, a site.webmanifest and an HTML snippet to paste into your <head>.
Do I still need a favicon.ico?
Yes — a favicon.ico at your site root remains the most compatible fallback, especially for older browsers and some feed readers. This tool generates it alongside the modern PNG icons.
Where do I put the files?
Extract them into your website’s root directory so they resolve at paths like /favicon.ico and /apple-touch-icon.png, then paste the HTML snippet into your pages’ <head>.
Related tools
Resize Image
Resize JPG, PNG and WebP images to any dimensions or percentage in your browser. Lock the aspect ratio, batch many at once, download a ZIP — nothing is uploaded.
Compress Image
Compress JPG, PNG and WebP images in your browser. See the before/after size, set the quality, and download — no upload, no limits, files stay on your device.
Color Picker
Pick any color from an image and get its HEX, RGB and HSL codes. Click anywhere on your photo — runs in your browser, no upload, files never leave your device.