What this App Icon Generator does
It takes one square source image — ideally 1024×1024 PNG or SVG — and renders every app icon size, folder and manifest a mobile, web or desktop project needs. Everything runs in your browser with HTML5 Canvas and JSZip: the image is never uploaded, nothing is stored on a server, and the page keeps working offline.
- iOS — a complete
AppIcon.appiconset with a valid Contents.json, flattened to opaque so App Store Connect accepts it.
- Android —
ic_launcher.png and ic_launcher_round.png for mdpi through xxxhdpi, adaptive ic_launcher_foreground.png layers with the 66dp safe zone applied, mipmap-anydpi-v26/ic_launcher.xml, a background colour resource and the 512×512 Play Store icon.
- Flutter, React Native and Capacitor — the same assets pre-arranged in each framework’s folder layout, ready to copy over.
- Web and PWA — a real multi-size
favicon.ico, PNG favicons, apple-touch-icon.png, 192/512 PWA icons, maskable variants, site.webmanifest and the <link> tags to paste.
- Desktop — a genuine macOS
.icns file plus its .iconset folder, a multi-size Windows app.ico, and the full Windows Store tile set.
How to generate your app icons
Three steps, about a minute, no account and no upload.
1
Add your source image
Drop a PNG, JPEG, WebP or SVG onto the drop zone, choose a file, or paste from the clipboard with Ctrl+V. The tool reports the dimensions and warns you if the image is smaller than 1024×1024 or is not square.
2
Pick platforms and style it
Tick the platforms you need, then set a solid or gradient background, padding, corner radius and fit mode. The preview redraws instantly under the iOS squircle, the Android circle and a rounded square, plus an actual-size 32px favicon check.
3
Generate and download
Hit Generate icons to render every size on your own device, review the tiles, then download one ZIP with the correct folder tree, Contents.json, ic_launcher.xml, site.webmanifest and a README already written.
Every folder in the ZIP mirrors where the files belong in a real project.
iOS app icon sizes reference
Every slot Xcode expects in an asset catalogue, and what each one is actually used for.
Android launcher icon sizes reference
Legacy icons are 48dp; adaptive icons are 108dp with only the middle 66dp guaranteed visible.
Why adaptive icons need a safe zone
An adaptive icon is two 108dp layers, foreground and background, that the launcher masks into whatever shape the device uses — circle, squircle, rounded square or teardrop. Only a centred 66dp circle is guaranteed to survive that mask, and the outer 18dp on each edge can be cropped or used for parallax. This generator scales your artwork into that safe zone automatically, so nothing important gets cut off on any launcher.
Designing an icon that survives every size
The output can only be as good as what goes in. A few habits make a large difference.
✓
Start at 1024, or vector
Design at 1024×1024 and export a PNG, or upload the SVG directly so every size is rasterised from vector data instead of an upscaled bitmap.
✓
One idea, bold shapes
Your icon will be shown at 16×16 in a browser tab. Thin strokes, gradients with low contrast and any text below a few hundred pixels disappear completely.
✓
Never bake in rounded corners
iOS, Android and macOS all mask the corners themselves. Ship a full-bleed square; a pre-rounded icon ends up with a visible double-rounded edge.
Frequently asked questions
Everything people usually ask about generating app icons.
Is my image uploaded to a server?
No. Every icon is rendered in your browser with HTML5 Canvas and packed into a ZIP with JSZip on your own device. The image never leaves your computer, nothing is stored, and the page keeps working offline once it has loaded.
What size should my source app icon be?
1024×1024 pixels, square, PNG or SVG. That is the size both the App Store and Google Play require, and every smaller icon is downscaled from it. An SVG is even better because it is rasterised at full resolution. Anything under 1024 pixels gets upscaled and will look soft on modern displays — the tool flags this for you.
Can iOS app icons have transparency?
No. App Store Connect rejects app icons that contain an alpha channel. This generator always flattens iOS icons onto the background colour you choose, so the output is fully opaque even when your source PNG is transparent. It also keeps iOS icons perfectly square, because iOS applies its own rounded squircle mask at display time.
What is an Android adaptive icon and what sizes does it need?
Since Android 8.0 a launcher icon is two layers — a foreground and a background, each 108dp square — that the launcher masks into a circle, squircle or rounded square. Only the middle 66dp is guaranteed visible, so the generator scales your artwork into that safe zone. It exports ic_launcher_foreground.png at 108, 162, 216, 324 and 432 pixels for mdpi through xxxhdpi, plus mipmap-anydpi-v26/ic_launcher.xml and a background colour resource.
Where do I put the generated icons in a Flutter project?
The ZIP already mirrors the Flutter layout. Copy flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset over the one in your project, and copy the mipmap folders from flutter/android/app/src/main/res into your own res folder. Nothing else needs changing; both platforms pick the icons up by name.
Does it create a real favicon.ico file?
Yes. A genuine multi-resolution favicon.ico containing 16, 32 and 48 pixel images is assembled byte by byte in the browser — not a renamed PNG. It comes with PNG favicons, an apple-touch-icon, 192 and 512 pixel PWA icons, maskable variants, a site.webmanifest and the HTML link tags to paste into your head.
What is a maskable icon?
A maskable icon is a PWA icon that fills the whole square and keeps its important content inside a centred circle covering about 80 percent of the width, so Android can crop it to any launcher shape without clipping your logo. The generator produces separate maskable-icon-192 and maskable-icon-512 files with the correct safe-zone padding and lists them with "purpose": "maskable" in the manifest.
Can I generate a macOS .icns or a Windows .ico?
Yes. Enable the macOS or Windows platform and the ZIP contains a real .icns file with every retina size from 16 to 1024, the matching .iconset folder for iconutil, a multi-size Windows app.ico, and the full set of Windows Store tiles including the wide and splash images.
Why does my icon look blurry at small sizes?
Usually because the source is below 1024 pixels, or the artwork has thin strokes. The generator downscales in halving steps to keep edges as sharp as a browser can manage, but a 2px line at 1024 pixels simply does not exist at 48. Design with bold shapes, avoid fine detail and text, and upload an SVG when you have one.
How much padding should an app icon have?
For iOS, none — the artwork should reach the edges of the square because iOS masks the corners itself. For Android adaptive icons the 66dp safe zone is applied for you. The padding slider is there for when your source is already a full-bleed logo that needs breathing room, and 8 to 12 percent is a typical choice.
Does the tool support SVG input?
Yes. An SVG is rasterised onto a 1024×1024 canvas before any icon is rendered, so every output size comes from crisp vector data rather than an upscaled bitmap. Make sure the SVG has a width, height or viewBox attribute, and that it does not reference external fonts or linked images — the browser will not load those into a canvas.
Can I use a non-square image?
You can, but you should not for an app icon. If the source is not square, Contain letterboxes it onto the background and Cover crops it to fill. Both work, but every store expects a square icon, so it is far better to fix the artwork than to rely on either.
Is the App Icon Generator free?
Yes. Completely free, no sign-up, no watermark, no daily limit and no upload. Generate as many icon sets as you like.
