← Back to the icon studio

From artwork to app icon.

Start with a clear symbol, choose your background, then export the platforms your project needs. All editing and downloads happen in your browser.

1. Prepare your artwork

Use PNG, JPG, WebP, or a static SVG up to 10 MB. Raster artwork should ideally be at least 1024 × 1024 pixels. Non-square artwork is fitted in the center without stretching. SVGs must be self-contained; export a PNG if your SVG uses embedded images or external resources.

Transparent artwork gives you more control over the background and produces a better Android monochrome silhouette. An opaque square will remain a square silhouette; this tool does not remove image backgrounds.

2. Adjust and preview

Use Artwork size to control padding. The background is included in opaque exports. iOS and Android preview masks show how the operating system may display your icon; corners are not baked into the iOS PNGs. Dark preview mode changes the workspace behind your icon, not the exported image.

Android adaptive foregrounds use a 108dp layer, with your artwork fitted inside the central 66dp area. The circle preview shows a representative launcher mask. Real launcher shapes and motion can vary.

3. Install in Xcode

Select iOS & iPadOS and download the ZIP. With the default “My app” name, drag ios/my_app.appiconset into your project's Assets.xcassets. Select my_app in the target's app icon settings. Your chosen name determines both the folder and PNG filenames. See the iOS app icon generator guide for included sizes.

The PNGs use RGB encoding without an alpha channel. These exports do not include Liquid Glass layers, an Icon Composer file, or dark/tinted appearance variants. For Mac targets, read the macOS compatibility guide.

4. Install in Android Studio

Copy the contents of android/res into app/src/main/res. Point your application icon to the generated resource name. For the default “My app” name:

<application
  android:icon="@mipmap/my_app"
  android:roundIcon="@mipmap/my_app"
  ... />

Legacy density images, adaptive foreground layers, background color resources, and adaptive XML are included. If you select Android themed icon, an Android 13 resource variant supplies a white silhouette; this requires compileSdk 33 or newer. The separate play-store.png is 512 × 512 pixels.

5. Install on the web

Copy the contents of web to your public root. For the default “My app” name, add these links to your page head and customize the manifest's name and start URL. Substitute your generated filenames if you chose another name:

<link rel="icon" type="image/png" sizes="32x32" href="/my_app-32.png">
<link rel="apple-touch-icon" href="/my_app-180.png">
<link rel="manifest" href="/my_app.webmanifest">

Web exports contain 16, 32, 180, 192, and 512-pixel PNGs. PWA icons use the “any” purpose; they are not declared maskable. For native Android resources, see the Android app icon generator guide.

Before you ship

Build your project and preview on real devices. Check small-size legibility, platform masks, background contrast, and store requirements. Automated image checks help prepare files; they do not guarantee app-store approval. Native build and submission validation are still your final checks.

Official references: Apple app icons and Android adaptive icons.