Add App Icons for iOS & Android

This guide explains where to add your app icons in a React Native project for both iOS and Android, including how to generate properly sized icons using

n a React Native application, icons must be placed in the correct platform-specific folders with the required sizes. Incorrectly sized or missing icons will result in missing app icons on device home screens or build errors.

This documentation shows:

• how to generate a full set of app icons automatically

• where to place those icons for iOS

• where to place those icons for Android

• best practices to ensure your icons display properly on all devices

You can use https://www.appicon.co/ to generate all required icon sizes at once by uploading a high-resolution PNG (e.g. 1024×1024). After conversion, download the ZIP and extract the following sets.

iOS App Icons (Where to Place)

ios/YourApp/Images.xcassets/AppIcon.appiconset/

What to Do

1. Open AppIcon.appiconset in Xcode or Finder.

2. Replace each icon size with the corresponding file from the AppIcon.co output.

3. Make sure filenames match the expected slots in the asset catalog.

4. In Xcode, verify that all image slots are filled (no missing icons).

Android App Icons (Where to Place)

React Native uses a set of mipmap folders for Android icons. Place your launcher icons into:

android/app/src/main/res/mipmap-hdpi/ic_launcher.png
android/app/src/main/res/mipmap-mdpi/ic_launcher.png
android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png

What to Do

1. From the AppIcon.co download, take the Android icon set.

2. Copy each generated launcher icon file into the matching mipmap-* folder above.

3. Replace the existing ic_launcher.png files with your new ones.

4. Clean and rebuild the Android project.

---

Tips for Success

• Always use PNG format with transparency where appropriate.

• The recommended source image is 1024×1024 PNG — this gives the best quality results.

• After replacing icons:

  • iOS: cd ios && pod install && npx react-native run-ios

  • Android: npx react-native run-android

• If your icons don’t show up immediately:

  • uninstall the app from the device/simulator

  • rebuild and reinstall

---

Helpful Tool

Generate icons automatically: https://www.appicon.co/ Upload your high-resolution source image and download all required sizes for both iOS and Android in one go.