Favicon Generator
Turn your logo into every icon a website needs: the browser tab favicon, the iPhone home screen icon and Android app icons. Get them all in one ZIP with the HTML to paste in.
How to make a favicon
- 1Choose your logo. An SVG or a square PNG of 512 px or more gives the best result.
- 2Pick whether to fit the whole image in a square or crop it, and the background.
- 3Check the previews, including how the icon looks in a browser tab.
- 4Download the ZIP, upload its files to the top folder of your site, and paste the HTML into the <head> of your pages.
The icons a website actually needs
A modern site needs only a handful of files. favicon.ico holds 16, 32 and 48 px versions for browser tabs, bookmarks and Windows; every browser looks for it, even on pages that don’t mention it. apple-touch-icon.png (180 px) is used when someone adds your site to an iPhone or iPad home screen. icon-192.png and icon-512.png, listed in site.webmanifest, are used by Android and when your site is installed as an app.
If you start from an SVG, the ZIP also contains icon.svg. Most modern browsers use it for the tab icon, and it stays sharp on every screen. The HTML snippet already lists it, and keeps favicon.ico as a fallback for browsers that need it.
Small icons need simple shapes. At 16 px, fine lines and small text disappear, so if your full logo has a wordmark, try just its symbol or first letter. Look at the browser tab preview above the icons: it shows the 16 px icon at its real size, in light and dark tabs.
100% private
Files are processed right in your browser. Nothing is ever uploaded to a server.
Every size at once
favicon.ico, the Apple touch icon and Android app icons from one image, in a single ZIP.
Fast & free
Uses every core of your CPU. No sign-up, no watermarks, no file limits.
Frequently asked questions
Where do I put the favicon files?
In the top folder of your website, the one that holds your home page, so they are reachable at /favicon.ico, /apple-touch-icon.png and so on. Then paste the HTML lines into the <head> section of every page, or your site template.
Why doesn’t my new favicon show up?
Browsers cache favicons very aggressively. Open your site in a private window, or add “?v=2” to the icon links in your HTML, to see the new one.
Can I use a JPG or HEIC photo?
Yes, any image works. Photos rarely read well at 16 px though, so a simple logo or symbol on a plain background usually makes a better favicon.
Are my files uploaded anywhere?
No. Everything runs inside your web browser. Your files never leave your device, and we never see them.