About this tool
A favicon is the small icon that browsers show in a tab, a bookmark list and a search result. This tool makes the whole set from one picture: a favicon.ico holding 16, 32 and 48 pixel sizes, two PNG favicons, an Apple touch icon, two Android icons and a web manifest file.
Choose how the picture fits the square, add padding, pick a background and round the corners. The preview shows the icon at 16, 32, 48 and 180 pixels on a light strip and a dark strip, so you can judge how it reads when it is tiny. Everything is drawn in your browser and nothing leaves your device.
How to use the Favicon Generator
- 1Add a PNG, JPG, WebP, SVG, GIF, BMP or AVIF image, ideally square.
- 2Choose Contain to keep the whole picture or Cover to fill the square.
- 3Adjust padding, background and corner radius while you check the small previews.
- 4Copy the HTML link tags and place them in the head of your pages.
- 5Download the ZIP, or save single files, and put them in the root folder of your site.
Features
Seven files from one image
Get favicon.ico, favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png, two Android icons and site.webmanifest in one pass.
A real ICO container
The favicon.ico holds 16, 32 and 48 pixel PNG images, a layout that every current browser reads.
Contain or cover fitting
Keep the whole image inside the square with padding, or crop it from the center to fill the square.
Light and dark previews
See the icon at 16, 32, 48 and 180 pixels on both a white strip and a near-black strip.
Ready-made HTML
A copyable block of link tags points at each file name inside the ZIP.
Frequently asked questions
Which size should my source image be?
Use a square image of at least 512 by 512 pixels. Smaller images still work, but the 512 pixel Android icon is enlarged and looks soft. SVG sources are drawn sharp at every size.
Why does the ICO file hold three sizes?
Browsers pick the entry closest to the size they need. The 16 pixel image suits tabs, 32 suits sharp screens and shortcuts, and 48 suits Windows site icons.
What do I do with the files after downloading?
Put them in the root folder of your site, paste the link tags into the head of each page, and fill in the name fields of site.webmanifest.
Is a transparent background kept?
Yes. With Transparent selected, the PNG files and ICO entries keep their alpha channel. Apple devices fill transparency with black on the home screen, so a solid background suits the Apple touch icon better.
Is my image uploaded to make the icons?
No. The image is decoded and resized with your browser canvas, the ICO is assembled in memory, and the ZIP is created on your device.