Free Favicon Generator
This free favicon generator turns one image into a real multi-size favicon.ico plus every PNG icon a site is asked for — 16, 32, 48, 180, 192 and 512 pixels — without uploading anything.
Drop your logo here
or paste with Ctrl+V, or choose a file
A square image at least 512px across gives the best result. Anything else still works — it will be cropped to a square first.
Runs entirely in your browser. Your images are never uploaded to a server.
How it works
- Drop your logo onto the box above, paste it with Ctrl+V, or choose a file. A square image at least 512 pixels across gives the best result.
- If it is not square, pick what happens: crop to the middle, or fit the whole picture in with space around it. Icons have to be square, so something has to give.
- Check the two preview strips. They draw each icon at the size a browser will really use it, on a light tab and a dark one — which is the only reliable way to tell whether 16 pixels is still legible.
- Download favicon.ico on its own, or take the ZIP, which also carries the PNGs, a web app manifest, and the HTML to paste into your page.
Common use cases
- Adding a favicon to a site for the first time, so the tab shows your mark instead of a blank sheet of paper.
- Making the icon that appears when someone adds your site to the Home Screen on an iPhone or iPad.
- Producing the 192 and 512 pixel icons a web app manifest needs, which is what a Lighthouse installability check looks for.
- Replacing every icon at once after a rebrand, without opening a design app and exporting six files by hand.
- Turning a logo that was drawn for a business card into something that still reads at the size of a tab.
Frequently asked questions
- What is a favicon.ico, and do I still need one?
- A .ico file is a small container that holds several square images at once, so a browser or an operating system can take whichever size it needs from one file. Modern browsers are happy with PNG icons declared in your HTML, but favicon.ico is still worth having: anything that guesses looks for it at the root of your site by name, without reading your page at all.
- Why does my logo turn into a smudge at 16 pixels?
- Because 16 pixels is 256 pixels in total, and a detailed logo needs more than that to say what it is. The fix is not a better resize — it is a different drawing. Drop the wordmark, keep one letter or one shape, thicken the lines, and raise the contrast. The two preview strips exist so you can see this happening rather than find out from a live tab.
- What is the apple-touch-icon, and why 180 pixels?
- It is the icon iOS uses when someone adds your site to their Home Screen, where it sits next to real apps. 180 pixels covers the largest iPhone screens, and iOS scales it down for everything smaller, so one file is enough. It also gets a rounded corner mask applied by the system — do not round the corners yourself.
- What are the 192 and 512 pixel icons for?
- Those two are named in a web app manifest rather than in your HTML. Android uses 192 on the home screen and 512 for the splash screen and the install prompt. The ZIP includes a site.webmanifest listing both, so you can drop it in and change the name.
- Where do the files go, and what HTML do I need?
- Put every file in the root of your site, the same folder your home page is served from, then paste the link tags this tool shows you into the head of your page. They are also saved in the ZIP as paste-into-head.html, so you still have them a week later.
- Is my image uploaded to a server?
- No. The image is decoded, redrawn at each size, and packed into the .ico entirely by your own browser. Nothing leaves your device and nothing is stored.
Related tools
Understand what this does
Plain explanations of what is happening to your file, and what it costs you.
- What is a favicon?The small square in the tab, and the handful of files that cover everything asking for one. The hard part is not making them — it is that a logo stops being readable long before it gets that small.
- Which logo file types do you actually need?The honest list is shorter than the one you were sent. One vector master you can re-export from forever, plus exports for the places that will not take it.
- Raster vs vector: what is the difference?One stores pixels, the other stores instructions. That is why your logo goes fuzzy on a banner, and why the printer keeps asking for a file you do not have.