What is App Icon Generator?

Upload an image — or type 1-3 letters or an emoji — and get every standard icon size, from a 16x16 ICO to a 1024x1024 App Store icon, plus a scalable favicon.svg. Includes Apple Touch, Android Chrome, MS Tile, and Safari pinned tab. Download sizes one by one or grab them all as a ZIP.

Start from your own logo or build a quick icon from a couple of letters or an emoji with your own colors and font. The generator produces 17 separate PNG files covering legacy favicon sizes (16, 32, 48, 64, 96, 128, 256), Apple Touch icons (152, 167, 180), the 1024 App Store icon, Android Chrome (192, 384), MS Tile (144, 150, 310) and PWA 512. Filter the grid by platform, pick square, rounded, or circular output shapes, and check the favicon against light and dark tabs before you download. Each ZIP also includes a multi-resolution favicon.ico, a scalable favicon.svg, a ready-to-paste HTML snippet, and a manifest.json with maskable purpose on the Android sizes — add an app name and short name to make it installable as a PWA.

How to use

1. Upload a high-resolution square image (at least 512×512px) as your source — or switch to text mode and type 1-3 letters or an emoji to build one instantly.
2. Review all generated sizes in the grid. Toggle sizes on or off for the platforms you need.
3. Download individual sizes, grab a multi-resolution favicon.ico, or click 'Download All' for a ZIP with every selected size, the ICO bundle, an HTML snippet, and a manifest.

When to use

• Launching a new site and needing favicon coverage across every browser and OS.
• Rebranding: regenerate every PWA and home-screen icon from the new logo.
• Adding install-to-home-screen support so Android can render a maskable icon.

Result

A web agency uploads their client's new logo for a brand refresh. They get 12 sizes for desktop, iOS Safari, Android Chrome, Windows tiles, and PWA manifest icons, all ready to use.

FAQ

What size should my source image be?

At least 512x512 pixels, square, with the logo centred and a bit of padding around it. Anything smaller will look blurry once it's scaled up to the 512 PWA icon. Vector source (SVG rasterized to PNG at 1024) is even better.

Why are there both PNG and ICO favicons?

Modern browsers use PNG at multiple sizes via link rel='icon', and increasingly prefer a single scalable SVG favicon. The .ico file is still required by older Windows browsers, hosting platforms and some pinned-site code paths. This generator outputs all three: PNGs for every modern size, a scalable favicon.svg, plus a single favicon.ico that bundles the 16, 32, and 48px frames.

What's a maskable icon and why does Android need one?

Android crops home-screen icons into a circle, squircle, or rounded square depending on the launcher. A maskable icon has a safe zone in the centre (about 80% of the canvas) so important parts of the logo never get cut off. Add ~10% padding around your source.

Where do I put the generated files?

Drop every PNG into your site's public root (or /static), copy the HTML snippet into the page head, and link the manifest.json. Apple Touch and favicon links go in the HTML head; PWA icons are referenced by the manifest.

Why do background and padding options exist?

Transparent logos often look fine on browser tabs but get awkwardly placed when Android or iOS adds its own rounded-rectangle behind them. Adding a solid background plus 8-12% padding here gives you predictable tile rendering across launchers.

Related Tools