Iconography

About iconography.


App Icons

Every app must supply both small and large app icons. The small icons are used on the Home screen and throughout the system once your app is installed. The large icon is used by the App Store.

Device App Icon (px) AppStore Icon (px) Spotlight (px) Settings (px)
iPhone 6+6+, 6S+ 180 x 180 1024 x 1024 120 x 120 87 x 87
iPhone6S, 6, SE, 5S, 5, 5C, 4S, 4 120 x 120 80 x 80 58 x 58
iPhone1st, 2nd, 3rd Generation 57 x 57 29 x 29 29 x 29
iPad Pro 167 x 167 120 x 120 58 x 58
iPadMini 2 & 3, Air, 3 & 4 180 x 180 120 x 120 87 x 87
iPad1, 2, Mini 1 76 x 76 40 x 40 29 x 29

Automatically Applied Effects

Rounded Corners

The old simple radii values for rounded corners are gone. Since iOS 7, app icons have been using the shape of a superellipse. Since Apple did not release an official template of the shape, you will have to use one of the unofficial templates out there that replicate the shape in more or less accurate ways.

The rounded corners should not be included in the final exported assets, but you might need them in your design process if you want to add effects, such as a stroke or shadows, that are aligned to the corner of the icon.

Warning

If you are masking your icon asset with the superellipse shape because you want to apply effects aligned to the corners, make sure not to use any transparency for the area outside the mask. Transparency is not supported at all for app icons and instead is rendered as plain black. If your mask is not 100% accurate, users will see small black fragments on the rounded edges. It’s recommend to set the background of the canvas to be the same as the app icon background.

Border Stroke

If the app icon you are using has a white background, a 1 pixel gray border stroke will be applied to make it easier to recognize the edges of the icon. This is only done in the settings app (if your application is listed there) and the AppStore.

Legacy Effects

On older iOS versions, these effects are applied automatically: rounded corners (not the same shape as iOS 7+ icons are using), drop shadows on the home screen and a gloss effect that can be disabled.