Change Logo in Flutter Android Application
Tags: flutter
Published: 2021-08-16 12:46:48

---
title: Change Logo in Flutter Android Application
published: true
date: 2021-08-16 04:30:00 IST
tags: flutter
canonical_url: https://mukhtharcm.com/change-logo-flutter-android/
---

## Intro

The Default Logo of a Flutter application is the Flutter Logo. I don’t think most applications will not be sufficient with this Logo.

There are many ways to change this default Logo. This includes using packages like [Flutter Launcher Icons](https://pub.dev/packages/flutter_launcher_icons) or using the built-in [Image Asset Studio](https://developer.android.com/studio/write/image-asset-studio) in the Android Studio.

But the First method needs to install a package and the second method needs us to use **Android Studio**. If you are like me, who doesn’t use Android Studio, There is a simpler and easy method.

There is a Website Called [Android Asset Studio](https://romannurik.github.io/AndroidAssetStudio/). It is created by an amazing developer called [Roman Nurik](https://github.com/romannurik). We can use this website instead of the **Image Asset Studio** which is only available on Android Studio. Let’s get started.

## Get Started

First of all, go to the above-mentioned website [https://romannurik.github.io/AndroidAssetStudio/](https://romannurik.github.io/AndroidAssetStudio/).

![Android Asset Studio](https://mukhtharcm.com/change-logo-flutter-android/asset-studio_hu4243508552c8495e03978e3dabd3109b_80406_800x0_resize_box_2.png) <figcaption>
<p>Android Asset Studio</p>
</figcaption>

Then click on **Launcher Icon Generator**.

You will be navigated to a studio-like page.

![Icon Generator Page](https://mukhtharcm.com/change-logo-flutter-android/icon-generator_hua6ff155514ddf3e6882d723a7b19490e_74494_800x0_resize_box_2.png) <figcaption>
<p>Icon Generator Page</p>
</figcaption>

If we look closely, we can see that we have **3** Options for creating an Icon.

The first one is Image. If we click on that, we’ll be prompted to select an Image.

![Select Image Dialog](https://mukhtharcm.com/change-logo-flutter-android/select-image_hue925e1e7634e5c9f4788f630a4defb33_104590_800x0_resize_box_2.png) <figcaption>
<p>Select Image Dialog</p>
</figcaption>

The second one is Clipart. If we select it, we’ll have to select an Icon.

![Select Icon](https://mukhtharcm.com/change-logo-flutter-android/select-clipart.png) <figcaption>
<p>Select Icon</p>
</figcaption>

And the third one is Text. And It allows us to Type a letter or a word.

![Type Text](https://mukhtharcm.com/change-logo-flutter-android/text_hud63e5c3b2e89ea683404786300bf2c43_59723_800x0_resize_box_2.png) <figcaption>
<p>Type Text</p>
</figcaption>

## Download Logo

After we prepared our logo, let’s Continue generating our Logo. For that, click on the blue Download icon on the top right corner. By default, it will download a file named `ic_launcher.zip`. This ZIP file contains all the files needed to change our Logo.

Next, extract this ZIP to somewhere.

## Changing Logo

If you have observed the file structure inside the Android Folder in a Flutter Project, you may have noticed there is an `src` folder inside it.

Inside that folder, there will be folders named **debug** , **main** , and **profile**. Our target is a folder named `res` inside the **main** folder.

![Folder Structure](https://mukhtharcm.com/change-logo-flutter-android/folder-structure.png) <figcaption>
<p>Folder Structure</p>
</figcaption>

We can see that many folders are starting with **mipmap** in them.

* * *

Now open the extracted **ic\_launcher** folder. We can see a folder named **src** similar to that we saw on the main folder.

The content of the **src** folder is also similar to the previous **src** folder we saw. But this one only has folders starting with **mipmap**. These are the folders which contain our new Logo.

![Folder Contents](https://mukhtharcm.com/change-logo-flutter-android/inside-folder.png) <figcaption>
<p>Folder Contents</p>
</figcaption>

Now copy all these folders to the First **src** Folder we opened. It will replace our old (Default Flutter Logo) with our New Logo.

## Final Steps

After Changing the Files, we have to completely rebuild our app to see the changes. For that, let’s clean our Flutter Project by running the below command.

```
flutter clean

```

If we run our project now, We can see that our Logo has been changed to the new One.

## Wrap

You can find more articles related to Firebase [Here](https://mukhtharcm.com/tags/firebase/)

Hope you found something useful here.

I’m always open to suggestions!

Let me know your suggestions and opinions on [Twitter](https://twitter.com/mukhtharcm) DM or drop a mail a [mukhtharcm@gmail.com](mailto:mukhtharcm@gmail.com).

If you’re feeling too generous, you can support me through [Buy Me a Coffee](https://buymeacoffee.com/mukhtharcm).

Finally, if you found this helpful, please share this within your reach so that more people can benefit from this. And Follow me on [Twitter](https://twitter.com/mukhtharcm) for getting more posts like these 😉.