Adaptive App Icons for Android

Modified on Mon, 21 Jun, 2021 at 6:02 PM

General Information


It is possible to create an adaptive app icon for your app, since the Android Version 0.

For Android, adaptive app icons are being supported by the Purple Apps with the template version 6.3.


Why? Adaptive app icons make devices more coherent by unifying the shape of all app icons. In addition, you have the possibility to create new visual effects for the symbols.


Important: It is mandatory to adjust your existing app icons, if you are upgrading from a version, that is older than template 6.3, to a higher app template.


If you want to modify your app template, we recommend to read this article. 


Table of contents

 

For further information about the advanced use of the icons, visit this external Links:

Understanding adaptive app icons https://medium.com/google-design/understanding-android-adaptive-icons-cee8a9de93e2

Designing adaptive app icons https://medium.com/google-design/designing-adaptive-icons-515af294c783



How to create the icon


Adaptive icons are actually made up of two layers; a foreground and a background. Both layers are at least 432 pixel x 432 pixel; the background must be fully opaque while the foreground may include transparency. These layers are stacked on top of each other. Please, create both as PNG. 



 

You can find a template to hand over to your designer, here:

Download template as Adobe Illustrator (ai) or Encapsulated PostScript (eps) file


 

How your icon should look like:


     


    App Icon foreground  |  App Icon background 



Please note: It's important that your logo/Icon for the foreground has enough space to the outer border, so that the icon is not getting cut of later:


The following dimensions must be taken into account:


01. 432 pixels, represent the total size of the icon area.

02. 262 pixels, is the safe area for the different shapes of the adaptive icon.

03. 211 pixels, is a small distance between the logo and the edges of the adaptive icon to avoid cropping.



In order to check whether the dimensions of the icon fit, we recommend the following website, where you can upload and check the foreground and background files. https://adaptive-icon-tester.nabettu.com/


How to upload the adaptive app icon into the Manager


Follow these steps to upload the Icon:


1. Go to App Design

2. Go to Android – Basic Settings

3. Upload the new App Icon to 01. App Icon Foreground (432 x 432 px, PNG)

4. Upload the mask to 02. App Icon Background (432 x 432 px, PNG)

5. Click on Save on the bottom of the page

   


How to test


Follow these steps to test the Icons on Android devices:


1. Go to Overview

2. Go to Build App

  

 


3. Choose Preview App – choose Android – click on Build

4. Back in Overview – find the QR code on the right side of the page, scan the code and download the app to your Android device

5. Important: In order to test, you need at least Android Version 8

 

 


6. Test on several devices how the adaptive app Icons look like on launch screen. If everything looks good, you can submit the release app in Manager.



Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article