Understanding Icon Size Requirements

Creating an app icon isn't just about design—it's also about delivering the right technical specifications. Both iOS and Android require multiple sizes of your icon for different contexts and devices.

iOS Icon Sizes

iPhone

180x180px (@3x): iPhone home screen on devices with 3x displays
120x120px (@2x): iPhone home screen on devices with 2x displays
60x60px (@1x): Base size for iPhone

iPad

167x167px (@2x): iPad Pro home screen
152x152px (@2x): iPad home screen
76x76px (@1x): Base size for iPad

App Store

1024x1024px: App Store listing (must not include alpha channel)

Settings and Notifications

87x87px (@3x): Settings on 3x displays
58x58px (@2x): Settings on 2x displays
29x29px (@1x): Base size for settings
60x60px (@3x): Spotlight on 3x displays
40x40px (@2x): Spotlight on 2x displays
20x20px (@1x): Base size for notifications

Android Icon Sizes

Launcher Icons

192x192px (xxxhdpi): Highest density screens
144x144px (xxhdpi): Extra-extra-high density
96x96px (xhdpi): Extra-high density
72x72px (hdpi): High density
48x48px (mdpi): Medium density (baseline)

Google Play Store

512x512px: High-res icon for Play Store listing

Adaptive Icons

Android 8.0+ uses adaptive icons with separate foreground and background layers:

108x108dp: Full size including safe zone
72x72dp: Visible area (center)
Keep important content within the 72x72dp circle

Best Practices for Export

File Formats

iOS: PNG without transparency (except for most sizes, which support it)
Android: PNG with transparency for adaptive icons
App Stores: PNG at specified sizes

Quality Considerations

Start Large

Always design your icon at the largest size you'll need (1024x1024px) and scale down. This ensures you maintain quality across all sizes.

Test at Small Sizes

While designing, frequently check how your icon looks at the smallest required sizes. Details that work at 1024px might become muddy at 48px.

Optimize Each Size

Don't just scale down—adjust details for smaller sizes. You might need to simplify elements or increase contrast for smaller icons.

Safe Zones

iOS

Keep important content within the center 80% of your icon. iOS automatically applies rounded corners and may mask edges.

Android

For adaptive icons, keep critical content within the center 66% (72dp of the 108dp canvas). Different launchers apply different masks.

Automation Tools

Several tools can help generate all required sizes from your master icon:

Xcode Asset Catalog: Built-in iOS solution
Android Studio Image Asset Studio: Android's built-in tool
Online generators: Various web services that export all sizes
Our platform: Automatically exports icons in all required sizes

Common Mistakes

Using Jpeg Instead of PNG

Always use PNG format. JPEG compression can introduce artifacts that look terrible on high-resolution displays.

Including Transparency in iOS App Store Icon

The 1024x1024px icon for the App Store must not have an alpha channel. It should have a solid background.

Ignoring Adaptive Icon Guidelines

On Android, make sure your design works with all possible masks (circle, squircle, rounded square, square).

Testing Your Icons

Before submitting your app:

Test on actual devices in both light and dark mode
Check how icons look against different wallpapers
View icons in all contexts: home screen, settings, notifications, app store
Get feedback from others on readability at small sizes

Conclusion

Getting icon sizes right is crucial for a professional-looking app. While it might seem tedious, proper sizing ensures your icon looks great everywhere it appears. Use automation tools where possible, but always manually verify the results on real devices.

App Icon Sizes: The Ultimate Guide for iOS and Android