App icon sizes for iOS, Android and the web
Every platform wants the same logo in a different set of sizes, with different rules about corners, transparency and how much of the edge it cuts away. The good news: modern tools need far fewer files than the old size charts suggest.
iPhone and iPad
Since Xcode 14, an app only needs one 1024×1024 PNG in its AppIcon asset. Xcode makes every smaller size from it when it builds the app. Older projects, and some third-party tools, still ask for the separate sizes: 180, 167, 152, 120, 87, 80, 76, 60, 58, 40, 29 and 20 pixels.
- No transparency. App Store Connect rejects an app icon with an alpha channel. Put the logo on a solid background colour.
- No rounded corners of your own. iOS applies its own corner mask. Supply a full square, or you will get a rounded square inside a rounded square.
Android
| Folder | Launcher icon | Adaptive foreground |
|---|---|---|
| mipmap-mdpi | 48×48 | 108×108 |
| mipmap-hdpi | 72×72 | 162×162 |
| mipmap-xhdpi | 96×96 | 216×216 |
| mipmap-xxhdpi | 144×144 | 324×324 |
| mipmap-xxxhdpi | 192×192 | 432×432 |
Since Android 8, launchers use adaptive icons: a foreground layer over a background layer, which each phone maker masks into its own shape (circle, squircle, teardrop). The foreground is drawn on a 108 dp canvas, but only the middle 66 dp or so is guaranteed to be visible. Keep the logo inside that middle area or it will be clipped on some phones.
Google Play also needs a separate 512×512 store icon, a full square that Play rounds for you.
Installable web apps
A web app manifest needs a 192 and a 512 pixel icon. Add a third, marked "purpose": "maskable", if you want Android to show it full-bleed instead of shrinking it onto a white circle. In a maskable icon the safe area is a circle 80% of the width across; everything outside it can be cut off. Add a 180 pixel apple-touch-icon for iPhone home screens. Tab icons are a separate set, covered in our favicon sizes guide.
Designing for every size at once
- Start at 1024 pixels or bigger, ideally from a vector. Enlarging a small logo makes it soft; the AI upscaler helps if a small file is all you have.
- One bold shape. Text below about six characters can survive at 48 pixels; a full company name cannot.
- Leave padding. 10 to 15% on every side keeps the mark clear of rounded corners and adaptive masks.
- Check the smallest size at actual size before you ship. That is the one that shows in settings screens and notifications.
Making the whole set
The App Icon Generator takes one square logo and downloads a ZIP with an ios folder (the 1024 asset for Xcode plus every older size), an android folder (the five mipmap folders, adaptive foregrounds and the Play Store icon) and a web folder (manifest and maskable icons and the Apple touch icon). iOS icons go on your background colour automatically. If your logo is an SVG, render it at full size first with SVG to PNG; if it is not square, square it with the canvas resizer rather than cropping it.