Create app icons and graphics

You can use our Figma template to generate the icons or create them manually in a program of your choice. Afterward, please send us the files so we can create the branded app for you.

 

Use our Figma Template

With our Figma Template you can easily create and export all app graphics, please use the following link to use our Figma template:

→ Figma Template

You can then send us the graphics as explained in the e-mail.

 


 

Create app icons and graphics manually

If you cannot use Figma, you can create the graphics with a graphics program of your choice. Please ensure you use the correct file name when sending us the graphics, as this will allow us to process them.

 

Google Play Store Icon

The Google Play Store icon is displayed in your app's profile on the Google Play Store.

 

flip_google_play_store.png

Requirements

Size 512 x512 px
File format png
Color range 32 bit
Color profile sRGB
File name google_play_app_store_icon.png
Transparency Allowed

 

You can find more information about the Google Play icon in the Google Help center.

 

Adaptive Android-Icon

The adaptive Android app icon is visible on the home screen. Android refers to this as a launcher icon. Launchers display app icons differently on Android devices. Some use square backgrounds, while others fit icons into a round shape. Adaptive icons ensure consistent size and shape.

 

This new icon type has a specific safe zone that accommodates various icon formats. Flip supports adaptive icons, ensuring your app icon looks perfect across all devices and Android versions.

 

You can find more information here: Designing Adaptive Icons and Understanding Android Adaptive Icons

 

adaptives_android_icon.png

Data in figures in dp

  • If your app icon uses letters or numbers: maximum 6 - 10 characters including spaces
  • please pay attention to the safety zone. Place the logo within the safety zone in the center and leave the edge free. Only use logo elements within the safety zone
  • The background outside the safety zone may contain shadows, color gradients or patterns.

Requirements

Size 1024 x 1024 px
File format png
File name android_background.png und android_foreground.png

 

Android Notification-Icon

Push notifications are automated alerts that apps send to mobile users when the push notification feature is enabled. When an app sends a push notification, Android devices display a small notification icon in the status bar and in the notification overview list when swiping down from the status bar.

android_push_icon.png

 

Requirements

Size 96 x 96 px
File format png
Resolution 72 dpi
Color profile sRGB
File name android_notification_icon.png
Color #FFFFFF
Background Transparent
Form Outlines only

 

iOS App Icon

The iOS app icon appears on the home screen and in the Apple Store. iOS devices display square icons with rounded corners. Transparency is not supported.

 

ios_app_icon.png

 

Requirements

Size 1024 x 1024 px
File format png
Resolution 72 dpi
Color profile sRGB
File name app_icon.png and app_store_icon.png
Background Transparency: not permitted (no alpha channel)
Form Square, corners filled in

 

You can find more information about the Apple app icon in Apple Help.

 

Splash Screen Icon

The splash screen icon appears when the app launches and establishes a connection to Flip in the background. This icon is necessary for both light and dark modes. We recommend using the same icon as the Apple app icon. Please keep in mind that, depending on the version of Android, two separate versions are required (two for light mode and two for dark mode). These versions will already be generated as assets when exporting from Figma.

 

flip_splashscreen.png

 

Requirements

Size (Android 12 or Higher) 960 x 960 px
Size (Android 11 or Lower) 576 x 576 px
File format png
Resolution 72 dpi
Color profile sRGB
File name splashscreen_light.png
splashscreen_dark.png
File name (Only for Android 12 or Higher) splashscreen_android12_light.png
splashscreen_android12_dark.png
Background Transparency: not permitted (no alpha channel)
Form Square, corners filled in

 

Checklist for sending the graphics to Flip

Please check again that you have created and named all files correctly. Then, send us the graphics as explained in the email.








 

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request

Comments

0 comments

Article is closed for comments.