Learn about configuring the app's icon and best practices for Android, iOS and the web.
Your app's icon is what users see on the home screen of their devices, as well as in the App Store and Play Store. This is one topic where platform differences matter and requirements can be strict. This guide offers details on how to make sure your App Icon looks as good as possible on all devices.
The most straightforward way to provide an icon for your app is to provide the icon key in app.json. If you want to do the minimum possible, this key alone is sufficient. However, Expo also accepts platform-specific keys under android.icon
and ios.icon
. If either of these exists, they will take priority over the base icon
key on their respective platform. Further customization of the Android icon is possible using the android.adaptiveIcon
key, which will override both of the previously mentioned settings. Most production-quality apps will probably want to provide something slightly different between iOS and Android.
Create an app icon and splash image with the Figma template and video below:
android.adaptiveIcon.foregroundImage
field in app.json to specify your foreground image.
android.adaptiveIcon.backgroundColor
field. You can instead specify a background image using the android.adaptiveIcon.backgroundImage
field; ensure that it has the same dimensions as your foreground image.android.icon
field. This single icon would probably be a combination of your foreground and background layers.If your app contains privacy: public
in app.json, it will show up on your expo.dev profile. We will mask your icon to have rounded corners in that circumstance, so if it already looks reasonable on iOS, it will probably look good here as well.