App icon sizes for Android, iOS and the web: the complete checklist

By Lyxvo · Published · 4 min read

Every platform wants its own icon files, and missing one means a blurry icon on someone's home screen or a rejected upload. Here is the complete list for Android, iOS and the web, why each size exists, and how to generate all of them from one design.

Start with one square master icon

Every size on this page is made from one master: a square icon at 1024 × 1024 px. Design it as a vector if you can, keep it simple, and test it at 48 px. If the symbol is unreadable at that size, it will be unreadable on a phone.

Rules that apply on every platform:

  • No small text. A wordmark rarely survives at icon size; use the symbol.
  • Keep it centred with room around it, because platforms crop icons into circles, squircles and rounded squares.
  • Avoid thin lines that disappear when the icon shrinks.
  • Check it on light and dark wallpapers.

Android icon sizes

Android uses density buckets. The base launcher icon is 48 × 48 dp, which becomes these pixel sizes:

FolderScaleLauncher icon
mipmap-mdpi1×48 × 48 px
mipmap-hdpi1.5×72 × 72 px
mipmap-xhdpi2×96 × 96 px
mipmap-xxhdpi3×144 × 144 px
mipmap-xxxhdpi4×192 × 192 px

Since Android 8.0, apps should also ship an adaptive icon: a foreground layer and a background (a colour or image), defined in mipmap-anydpi-v26/ic_launcher.xml. The adaptive canvas is 108 × 108 dp, and the system masks it into the shape the phone uses, so keep the important part within the central area. A round icon (ic_launcher_round) is used by some launchers.

For the store listing, Google Play asks for a 512 × 512 px icon.

iOS icon sizes

On current versions of Xcode you can provide one 1024 × 1024 px icon and let Xcode derive the rest, but many projects and tools still use the full AppIcon set for older targets. The classic set includes these pixel sizes:

Size (px)Used for
1024App Store
180iPhone home screen (3×)
167iPad Pro home screen
152iPad home screen
120iPhone home screen (2×), Spotlight (3×)
87, 58, 29Settings
80, 40Spotlight
76iPad (1×)
60, 20Notifications

The App Store icon must be a square without transparency; iOS rounds the corners itself, so do not round them in your file. The set lives in AppIcon.appiconset with a Contents.json that tells Xcode which file is which.

Web icon sizes

Websites and installable web apps (PWAs) need a smaller set:

  • favicon.svg: a vector favicon for modern browsers.
  • favicon PNG at 16, 32 and 48 px: for browsers and places that need bitmaps.
  • apple-touch-icon.png, 180 × 180 px: used when someone adds your site to an iPhone home screen.
  • icon-192.png and icon-512.png: referenced from the web manifest for Android and installable apps.
  • A maskable 512 px icon: with extra padding, so Android can crop it into its own shape.
  • site.webmanifest: the file that lists the icons, the app name and the theme colour.

Generate every size from one design

Making 30-plus files by hand is slow and easy to get wrong. In Lyxvo AI:

  1. Open Lyxvo Design and pick the App brand kit group, then Everything (Android + iOS + web + logo). You can also choose just the Android kit, iOS kit or Web kit.
  2. Type the app or brand name and what it does: "Saku, a budgeting app for young professionals. A simple wallet symbol, teal on white."
  3. The agent draws logo concepts where the square icon matters most: bold and readable at 48 px.
  4. Pick a concept and download the kit. Nothing downloads by itself; you choose the files from the buttons on the logo you pick.

The zip contains android/res/mipmap-* folders with launcher, round and foreground icons, the adaptive icon XML and background colour, android/play-store-icon-512.png, the full ios/AppIcon.appiconset with Contents.json, the web/ folder with favicons, touch icon, manifest icons and site.webmanifest, and the logo files. A README explains where each folder goes in your project.

The app icon generator page shows more examples of icon kits made this way.

Where the files go

  • Android Studio: copy the res folders into app/src/main/res, replacing the default icons.
  • Xcode: replace the contents of Assets.xcassets/AppIcon.appiconset with the folder from the zip.
  • Flutter: put the Android and iOS files in android/app/src/main/res and ios/Runner/Assets.xcassets/AppIcon.appiconset.
  • Website: put the web files in the site's root folder and link them in the page's head; reference site.webmanifest with a link tag.

Platform requirements change over time. Before you publish, check the current icon guidelines from Apple and Google for your target versions.

A last check before you ship

Look at your icon on a real phone, on a light and a dark wallpaper, next to other apps. Is it recognisable in half a second? If yes, you are done. If not, simplify the symbol and generate the kit again.

Want the whole brand, not only the icon? Read AI logo and brand kit: every file you need.

Try it in Lyxvo AI

Describe it in your own words and the design agent starts on the right flow. Free to start.

Lyxvo Design · Lyxvo Lite free

Related tool: AI app icon generator with every size in one zip

More guides

All guides

Design your next idea with AI

Apps, websites, logos, posts, slides and flyers, from one prompt.