Mobile App Design: App Icon

This section houses images that are used for the App Icon that is shown throughout the iOS and Android OS (i.e. on the end-users’ home screen or app drawer).

Icon:

This is the image for the “composite” app icon. iOS exclusively uses this image as the app icon. Android will use this image as the app icon when either Background or Foreground is not set or on devices older than Android 8.0: API level 26; this is <5% of android users at the time of writing, 

This image should be a square aspect ratio, at least 512x512 in size, and must not include any transparency (transparency will be forcefully removed for iOS, and the end result of this process may vary)

App Icon on iOS	App Icon on Android (Using Foreground & Background)	App Icon on Android when Foreground or Background are not set

Background & Foreground:

These images are used in tandem to create an Adaptive App Icon on Android. This unlocks many features on Android, including allowing end users’ to personalize the shape of their icon, and the ability for the OS to dynamically animate an icon on touch or when moved. In general, non-Adaptive App Icons can feel “cheap” to end users and convey a lack of quality upon first impression. While not required, it is highly recommended to include a foreground and background, even if the foreground is a simple crop of the composite icon, and the background is a solid color.

Examples of Non-Adaptive Icons compared to Adaptive Icons	Example of Adaptive Icons ability to change shape	Example of Adaptive Icon animagions

The foreground image should be transparent, and contain the primary subject of the app icon. This image should be a square aspect ratio, at least 512x512 in size.

The background image should not be transparent, and contain a solid color, pattern, or gradient that contrasts with the foreground. When using a solid color, it is recommended to create a 1x1 pixel image of the color. This image will be scaled to the correct size and preserve the solid color, while saving space.