Skip to main content
All CollectionsAppTheme
Customize your app icon
Customize your app icon
Updated over a week ago

Your app icon is crucial for your branding. It appears on your app’s listings on App Store and Play Store, on user’s screens when installed, as the favicon for your web app, and more. This guide will help you customize your icon.

Icon properties

There are three properties of the app icon that you can customize:

  • Background color: The color behind your icon image.

  • Image: The picture in the foreground of your icon.

  • Image size: The proportion of the icon space filled by the image.

Icon shapes

The shape of an app icon is determined by the platform on which it is installed. This cannot be changed. Your icon will be cropped to fit various shapes, so bear this in mind when designing your icon. The admin dashboard provides a preview of your icon in several common shapes. Our icon system is designed to present your icon as consistently as possible across all platforms.

Centered images

Centered images are positioned in the middle of the icon, above the background color. If you have a standalone logo that you want to display over a solid color, consider using a centered image.

To achieve this, upload your image as a PNG with transparency and adjust the “Image size” property until your image fits comfortably inside each icon shape shown in the preview.

Do not attempt to match the size of your image exactly to the shapes shown in the preview. The exact shape will vary by platform. If you wish to fill the entire icon shape with your image, use a “full-bleed” image (see below).

Full-bleed images

Full-bleed images occupy the entire visible area of an icon. If your icon includes a gradient or pattern that should extend from one edge of the icon to the other, consider using a full-bleed image.

To achieve this, set the “Image size” property to 100%. If the image size is not set to 100% then the image edges may be visible within the icon on certain platforms, even if this is not reflected in the preview.

Setting the image size to 100% leads to natural cropping of your image. This cropping is applied by the platforms on which your app may be installed and can't be adjusted. When designing your icon, keep all the crucial elements inside a circular area with a diameter of 60% of the image width to avoid them being cut off.

Keep in mind that the cropped area of your icon may still be revealed by platforms under certain conditions, so it’s still important that any background colors, gradients, or patterns extend all the way to the edges of your image.

Submitting changes

App icon changes can't be published immediately. They need to be reviewed by Google and Apple before publishing. Let us know if you have changed your icon post-launch and want us to resubmit it for review.

Did this answer your question?