Why use Favicon Generator
A single source image, uploaded once, is resized here into every favicon size a modern site actually needs: the small tab icons browsers use, the apple-touch-icon iOS asks for on the home screen, and the larger sizes Android and PWA manifests expect. Each size downloads as its own correctly-named PNG file, alongside the exact HTML tags to reference them, so the whole set is ready to drop into a site's root folder and `<head>` without any manual resizing.
Why so many separate files instead of one favicon.ico
Modern browsers and platforms request specific pixel sizes for different contexts rather than relying on one legacy .ico file — a browser tab wants something small and crisp, while an iOS home-screen icon is displayed much larger and needs its own dedicated size to avoid looking soft. Generating each size directly, rather than cramming multiple resolutions into a single .ico container, matches how contemporary sites are actually built and is what tools like Lighthouse check for.
Using Favicon Generator
- 1
Upload a square source image — a logo or icon works best.
- 2
Pick a background colour to fill any transparent or letterboxed area.
- 3
Download each generated size.
- 4
Copy the HTML tags into your page's <head>.
- 5
Upload the downloaded files to your site's root folder.
What people use it for
Launching a new site with no favicon yet
Generate a complete, correctly-sized set from an existing logo in one pass, rather than manually resizing it six separate times.
Replacing a stretched or blurry favicon
Regenerate every size cleanly from a fresh source image after noticing an old favicon looks pixelated at some sizes but not others.
Adding proper home-screen icon support
Add the apple-touch-icon and Android sizes a site may be missing, so it looks like a proper icon rather than a generic browser placeholder when saved to a phone's home screen.
Worth knowing
- Start from a square image — anything non-square is centred and padded with the background colour, which can look off-centre if the source is heavily rectangular.
- Simple, high-contrast logos read far better at 16×16 than detailed illustrations, which tend to blur into an unrecognisable smudge at that size.
- Keep all six files together in your site's root folder — the generated HTML tags reference them by their exact filenames.