How To Auto-Generate Ionic iOS App Logo & Splash Screen

Icon Source Image

Save an icon.png, icon.psd or icon.ai file within the resources directory at the root of the Cordova project. The icon image’s minimum dimensions should be 192×192 px, and should have no rounded corners. Note that each platform will apply it’s own mask and effects to the icons.

For example, iOS will automatically apply it’s custom rounded corners, so the source file should not already come with rounded corners.

What I do here is replace the icon.png in resources folder with a new 1024×1024 PNG file. And then run the following command:

$ ionic resources --icon

Splash Screen Source Image

Save a splash.png, splash.psd or splash.ai file within the resources directory at the root of the Cordova project. Splash screen dimensions vary for each platform, device and orientation, so a square source image is required the generate each of various sizes.

The source image’s minimum dimensions should be 2208×2208 px, and its artwork should be centered within the square, knowing that each generated image will be center cropped into landscape and portrait images.

The splash screen’s artwork should roughly fit within a center square 1200x1200px.

What I do here is replace the splash.png in resources folder with a new 2208×2208 PNG file. And then run the following command:

$ ionic resources --splash

This will generate all the needed icons and splash screens for all your targeted devices.

Generating Icons and Splash Screens

To generate both icons and splash screens, follow the instructions above and run:

$ ionic resources

Source: Ionic Docs