Favicon & App Icons
One square image becomes every icon a website needs, plus the markup.
- Add
- Adjust
- Make
- Keep
How to use this tool
- Add your files — drag them onto the page or choose them. They stay on your device.
- Add one square-ish source image — the subject should sit near the centre because the smallest sizes crop in visually.
- Pick a background colour for the opaque icons and choose whether to include the 1200×630 social card.
- Press “Build icon set” and download the results, individually or as one ZIP.
About this tool
One square image becomes every icon a website needs, plus the markup. Free and unlimited, and nothing is uploaded: it all runs in your own browser. It runs entirely in your own browser — your file is never uploaded to a server, and the result downloads straight from your device, free, with no account and no watermark.
Privacy & limitations
One run makes a fixed set — favicon.ico (16, 32, 48 and 256 px), apple-touch-icon.png (180 px), icon-512.png and, if chosen, og-image.png (1200×630); the sizes cannot be changed, and it does not write manifest.json entries — copy the file names into your own manifest. The social card is cropped from the centre of your image to 1200×630, so a tall or square source loses its top and bottom; small sources are scaled up and will look soft.
Last updated:
Frequently asked questions
What size should the source image be?
At least 512 by 512, square, with the artwork not too close to the edges. Everything is scaled down from it, so anything smaller will look soft at the larger sizes.
Why do I need so many icon sizes?
Because each place uses its own: 16 pixels in a browser tab, 180 for an iPhone home screen, 512 for an Android splash screen. Supplying each one avoids the system scaling a wrong-sized icon badly.
Do I still need favicon.ico?
It is worth having. Some older browsers and crawlers request /favicon.ico directly and ignore the link tags, so the multi-size ICO covers them.
What is the Open Graph card for?
It is the picture shown when your link is shared on social media or in a chat. Without one the link appears as a bare blue rectangle.