The App Store Icon
The app store icon is a graphic representation of your brand, it’s a visual expression of your app. While this is a required asset for publishing an iOS or Android app on the stores, it’s very important that it also stands out.
As the Apple App Store and Google Play Store are competitive markets, your app store icon has to be eye-catching. If your app icon is designed for your audience and it represents your app, it will help you gain more attention & increase downloads.
Besides, the app icon will appear throughout the app stores (app page, featured pages, search results) and on several devices, throughout the OS (settings menu, spotlight section).
In this article, you can see all the required app store icons that you have to create before you publish your app on the Apple App Store and Google Play Store.
Read below and start working on your app icon. 👇
1. Apple App Store Icons
Your app store icon will be displayed both on the app store and across your users’ devices. Above all, make sure you design your app store icon recognizable with a single focus point so that your users will identify it easily.
Your app icon is the strongest graphic assets of your app. Therefore, you have to make sure that you create your own, unique app icons using your brand colours.
In addition, use your app icon to help potential users predict what your app is about. Design your app store icon with square corners. When needed, these will be automatically rounded.
As an example, we included app store icons we created for Ready Set Holiday’s app store listing.
Uploaded
Rounded
Main Categories
Your app store icon appears in 5 main categories:
- App store – used to display in the app store.
- Home screen & system – used on the home screen and throughout the OS after the app is installed.
- Spotlight icon – used when your app name matches a search term in the Spotlight section.
- Settings icon – used in the built-in Settings app.
- Notification icon – used when you send notifications.
Check out these examples from Apple with icons displayed throughout the device.
App Icon Sizes
All these app icons differ in size but they should have the same design for consistency. Here are all the sizes you need:
App Icon Attributes
Shape
Square (your icon will be rounded automatically).
Colours
Use sRGB or P3 colour schemes.
Layers
Make flattened layers with no transparency.
Format
App icons for the app store have to be .PNG format.
Do’s and don’ts
First, test your icon on different wallpapers to see how it will look on the phone and on different backgrounds.
Then, make sure you use a clean and easy to see design. It’s not recommended to put text or screenshots on your app icon, it will be harder to read for users. If you need more details to get started, check out all the guidelines from Apple.
2. Google Play Store Icons
Your Android app icon will be a bit different compared to app icons for your iOS app.
Last year, Google Play has adopted an icon system to ensure consistency and a cleaner look among all apps on the store and across different devices. This also helps app developers focus on the visuals instead of focusing on the shape of the logo.
For your Google Play store listing, you will have to create a square app icon. Then, to this icon, Google Play will automatically apply rounded corners (the corner radius is 20%) and shadows.
App Icon Attributes
Shape
Square (rounded corners & shadows will be applied).
Colours
Use sRGB colour schemes.
Size
Android app icons have to be 512×512 px and max 1024kb.
Format
App icons have to be 32-bit .PNG format.
Do’s and don’ts
If you want to apply a background colour, use one of your brand colours. But avoid transparent backgrounds because they will display the background colour of Google Play. Take a look at the picture below or find out more here.
“From left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.”
Source: Google Play
Don’t place your logo on the entire background if you’re only displaying minimalistic artwork. However, if your logo is based on an illustrated artwork, it might look better on a full background. In addition, use the keyline grids from Google Play to test how your logo looks best.
“From left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.”
Source: Google Play
Resources
Before you start working on your app icon, check out these helpful resources from Google Play:
Generally, people recognise a person by their face. It’s the same with your app icon, too – it’s “the face” of your app.
We hope this article will help you get started on your app store icons. Take some time to think about the assets you want to present to your users. Then, focus on creating a remarkable app store icon for your app.
And finally, to make a better impression on your users, avoid including unnecessary details in your app icon. Stay consistent in your design and branding.
We will do our best to keep this post updated with the latest changes. Don’t hesitate to write to us if you have any questions.
Just Getting Started on Your App Store Listing?
Next Step: Create Beautiful App Store Screenshots
We gathered all the necessary info for you to get started on your app store screenshots.
Want to Develop Your Own App?
You’re in the right place. At Cobalt Sign, we’re building apps for iOS and Android since 2011 and we love every part of it. We always stay up to date with the latest technologies and we like to take a meticulous approach to create gorgeous apps, starting from just an idea to product launch.
