Ionic Splash Screens and Icons

Creating Splash Screens and Icons for your Ionic app

Splash Screen and App Icons

Support for splash screen and icon generation is now available in Capacitor. For complete details, see the Resource Generator documentation.

This tool will crop and resize JPEG and PNG source images to generate icons and splash screens for modern iOS, Android, and Windows. cordova-res was developed for use with Cordova, but Capacitor and other native runtimes are supported.

First, install cordova-res globally.

$ npm install -g cordova-res

cordova-res expects a Cordova-like structure such as:

resources/
├── android
|   ├── icon-background.png
|   └── icon-foreground.png
├── icon.png
└── splash.png
config.xml

Place one icon and one splash screen file in a top-level resources folder within your project.

• resources/icon.(png|jpg) must be at least 1024×1024px

• resources/splash.(png|jpg) must be at least 2732×2732px

• config.xml is optional. If present, the generated images are registered accordingly

Now, run the following commands to generate all images and to copy the generated resources into the native projects:

$ cordova-res ios --skip-config --copy
$ cordova-res android --skip-config --copy

Please check the Capacitor official docs for more details.