Adaptive icons

An adaptive icon, or AdaptiveIconDrawable, can display differently depending on individual device capabilities and user theming. Adaptive icons are primarily used by the launcher on the homescreen, but can also be used in shortcuts, the Settings app, sharing dialogs, and the overview screen.

An adaptive icon can adapt to different use cases as follows:

A repeating animation of the same sample Android icon, showing different shapes depending on the mask used -- a circle and then two different kinds of squircles
Figure 1: Adaptive icons support a variety of masks, which vary from one device to another

Different shapes

An adaptive icon can display a variety of shapes across different device models. For example, it can display a circular shape on one OEM device, and display a squircle on another device. Each device OEM must provide a mask, which the system uses to render all adaptive icons with the same shape.

User theming

Starting with Android 13 (API level 33), users can theme their adaptive icons. If a user has enabled themed app icons (in other words, turned on the Themed icons toggle in system settings), and the launcher supports this feature, the system uses the coloring of the user’s chosen wallpaper and theme to determine the tint color.

Examples of three Android devices, each one showing a different user theme with different tints: the first shows a wallpaper with dark tinting; the second shows a golden-tinted wallpaper; the third shows a wallpaper with light grey with bluish tints wallpaper. In each example, the icons have inherited the tinting of the wallpaper and blend in perfectly.
Figure 3: Adaptive icons inheriting from the user's wallpaper and themes

The home screen does NOT display the themed app icon—and instead displays the adaptive or standard app icon—in any of the following scenarios:

  • If the user hasn't enabled themed app icons
  • If your app doesn't provide a monochromatic app icon

  • If the launcher doesn't support themed app icons

    Examples of two circle-shaped Android sample icons, animated to show user response. The first icon shows the Android logo wobbling left then right, then up and down inside the circle. The second icon expands and then contracts again.
    Figure 2. Examples of visual effects displayed by an adaptive icon

Visual effects

An adaptive icon supports a variety of engaging visual effects, which display when users place or move the icon around the homescreen.

Design adaptive icons

To ensure that your adaptive icon supports different shapes, visual effects, and user theming, the design must meet the following requirements:

  • Provide two layers for the color version of the icon: one for the foreground, and one for the background.

    An example of a foreground layer (left image) and a background layer (right image). The foreground shows the 16-sided icon of a sample Android logo centered within a 72 x 72 safe zone. The safe zone is centered inside of a 108 x 108 container. The background shows the same measured dimensions for the safe zone and the container, but only a blue background and no logo.
    Figure 4. Adaptive icons defined using foreground and background layers. The 72 x 72 safe zone in the second image shows where your icon and foreground layers will never be clipped by a shaped mask defined by an OEM.


    Example showing the icon from the preceding image overlaid on a circular mask.
    Figure 5. An example of how foreground and background layers look together, with a circular mask applied.

  • If you want to opt-in to supporting user theming of app icons, provide a single layer for the monochrome version of the icon.

    An example of a monochromatic icon layer (left image) and color previews (right image). The monochromatic layer shows the 16-sided icon of a sample Android logo centered within a 72 x 72 safe zone. The safe zone is centered inside of a 108 x 108 container. The color previews show this layer would display when applied to differently-colored user themes (orange, pink, yellow, and green).
    Figure 6. A monochromatic icon layer (left) with examples of color previews (right).

  • All layers must be sized at 108 x 108 dp.

  • The icons should be clean edges; the layers must not have masks or background shadows around the outline of the icon.

  • The logo must be at least 48 x 48 dp; it must not exceed 72 x 72 dp because the inner 72 x 72 dp of the icon appears within the masked viewport.

  • The outer 18 dp on each of the four sides of the layers are reserved for masking and to create visual effects such as parallax or pulsing.

To learn how to create adaptive icons using Android Studio, see our Android icon Figma template or Android Studio documentation for creating launcher icons.

Add your adaptive icon to your app

To add an adaptive icon to your app, update the android:icon attribute in your app manifest to specify a drawable resource. You may also define an icon drawable resource using the android:roundIcon attribute—but only if you require a different icon asset for circular masks, for example in a case where your branding relies on a circular shape.

The following code snippet illustrates both of these attributes, but most apps will only specify android:icon:

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

Next, in res/mipmap-anydpi-v26/ic_launcher.xml, create alternative drawable resources in your app for backward-compatibility with Android 8.0 (API level 26). You can then use the <adaptive-icon> element to define the foreground, background, and monochromatic layer drawables for your icons. The <foreground>, <background>, and <monochrome> inner elements all support the android:drawable attribute.

<?xml version="1.0" encoding="utf-8"?>
...
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
    <background android:drawable="@drawable/ic_launcher_background" />
    <foreground android:drawable="@drawable/ic_launcher_foreground" />
    
    // Starting with Android 13 (API level 33), you can opt-in to providing a
    // <monochrome> drawable.
    <monochrome android:drawable="@drawable/ic_launcher_monochrome" />
</adaptive-icon>
...

You can also define drawables as elements by enclosing them in the <foreground>, <background>, and <monochrome> elements. The following snippet shows an example of doing this with the foreground drawable.

<?xml version="1.0" encoding="utf-8"?>
...
<foreground>
   <inset
       android:insetBottom="18dp"
       android:insetLeft="18dp"
       android:insetRight="18dp"
       android:insetTop="18dp">
       <shape android:shape="oval">
           <solid android:color="#0000FF" />
       </shape>
   </inset>
</foreground>
...

If you want to apply the same mask and visual effect to your shortcuts as regular adaptive icons, use one of the following techniques:

  • For static shortcuts, use the <adaptive-icon> element.
  • For dynamic shortcuts, call the createWithAdaptiveBitmap() method when you create them.

For more information on shortcuts, see App shortcuts overview.

Additional resources

See these resources for additional information on designing and implementing adaptive icons.