Nylo home page
  1. Basics
  2. App Icons
Notice: You're viewing an old version of the Nylo documentation.
Consider upgrading your project to Nylo 6.x.
Basics

App Icons


Introduction

You can build all your app icons using flutter pub run flutter_launcher_icons:main from the command line. This will take your current app icon in /public/assets/app_icon/ and auto-generate all your iOS and Android icons.

Your app icon should be a .png with the size dimensions of 1024x1024px

If you have custom icons for different operating systems you can also just add them manually.

Nylo uses the flutter_launcher_icons library to build icons, to understand the library more you can check out their documentation too.


Generating app icons

You can run the below command from the terminal to auto-generate your app icons.

flutter pub run flutter_launcher_icons:main

This command will use the app icon located in your /public/assets/app_icon directory to make the IOS and Android app icons to the correct dimensions.


Adding your app icon

You can place your 'app icon' inside the /public/assets/app_icon directory.

Make your icon filesize is 1024x1024 for the best results.

Once you’ve added your app icon, you’ll then need to update the image_path if your filename is different to the default Nylo app icon name.

Open your pubspec.yaml file and look for image_path section, this is where you can update the image path for the file. Make sure that the “image_path” matches the location for your new app icon.


App icon filenames

Your filenames shouldn’t include special characters. It’s best to keep it simple, like “app_icon.jpg” or “icon.png”.


App icon file types

The App Icon needs to be a .png type.

App icon attributes.

Attribute Value
Format png
Size 1024x1024px
Layers Flattened with no transparency

If you are interested in learning more, you can view the official guidelines from both Google and Apple.

  • Apple’s human interface guideline is here
  • Google’s icon design specifications are here


Configuration

You can also modify the settings when generating your app icons. Inside the pubspec.yaml file, look for the flutter_icons section, and here you can make changes to the configuration.

Check out the official flutter_launcher_icons library to see what's possible.