Convert SVG to App Icon: Every Size You Need in One Click
Vectors Are the Right Source. Exporting Them Isn't.
If you design your app icon in SVG, you already made the smart call. Vectors scale, stay crisp on any density, and keep your file size tiny in source control. The problem starts the moment you have to ship: iOS wants twelve sizes, Android wants seven, and the web wants another handful for favicons and PWA manifests. That's 24+ PNGs from a single source — and most designers still export them one by one in Figma or Illustrator.
This article walks through every size you actually need in 2026, why SVG remains the best starting point, and how to compress the whole export step into a single drop-and-download with our free SVG to icon tool.
The Sizes You Actually Need
iOS (12 sizes)
Apple's asset catalog expects 1024, 180, 167, 152, 120, 87, 80, 60, 58, 40, 29 and 20px PNGs. The 1024 is the App Store marketing icon. Everything else maps to home screen, settings, Spotlight and notifications across iPhone and iPad at @1x, @2x, and @3x densities.
Android (7 sizes)
Play Store needs 512px. Adaptive launcher icons need 192 (xxxhdpi), 144, 96, 72, 48 and 36px. If you ship an adaptive icon you'll also want a 108px foreground layer, but for most projects the size table above is enough.
Web (5 sizes)
16, 32, 180 (apple-touch-icon), 192 and 512px. The 192 and 512 plug straight into your PWA manifest.
Why SVG Is Still the Best Source in 2026
Bitmap source files force you to design at the largest target size and downscale — which loses sharpness on small icons. SVG goes the other way: render once per size, at native resolution, with crisp paths. You can also re-color or restyle without re-exporting. Adobe Illustrator, Figma, Sketch and even Penpot all export clean SVG today.
A few practical SVG tips before you export:
- Flatten transforms — nested transforms render inconsistently in some browsers.
- Convert text to outlines — never trust a font to be available where your icon renders.
- Use a square viewBox (
0 0 1024 1024is ideal). Non-square viewBoxes get stretched or letterboxed. - Keep the symbol inside an 80% safe zone — iOS will mask the corners, Android will mask into a circle or squircle.
How to Generate the Whole Pack in One Click
Our free SVG to icon converter renders your file to every iOS, Android and web size at native resolution, then bundles the result as a ZIP. The entire flow:
- Drop in your
.svg. - Pick a background — transparent, white, or black.
- Optionally add padding (helpful when your symbol bleeds to the edge) and corner radius (helpful for web favicons).
- Click Download icon pack. You get a
ios/,android/andweb/folder, plus your source SVG.
No signup, no upload to a server — the rendering happens in your browser, so your file never leaves your machine.
Common Export Mistakes to Avoid
- Exporting one size and upscaling — never. Render each size from the SVG.
- Forgetting transparent vs opaque — iOS rejects icons with alpha in the App Store upload. Always include a fully opaque background variant for the 1024 marketing asset.
- Skipping the 20 and 29 — these are the notification and settings icons. Apple's validator will reject your build if they're missing.
When You Need More Than a Conversion
If you don't have an SVG yet — or your current one looks dated — generating a fresh one with AI is now faster than hiring out the work. Our main icon generator turns a prompt into a polished, App Store-ready icon in seconds across 21 premium styles. The free SVG-to-icon tool then takes the export step off your plate.
The Short Version
Keep your icon in SVG. Render every required size from that single source. Don't waste an hour clicking export-as in Figma when a browser-based tool can deliver the whole pack in under a second. Drop your file into the SVG to icon converter and ship.