Icon - how enlarge icon

Ionic Framework
1

I am creating an icon for my Ionic app but, when i generate the apk is the app icon contains a white border around the image.

icon

How to enlarge icon image to eliminate this white border.

  • Image 1: icon.png (1024px x 1024px)
  • Image 2: How the icon appears on Android
  • Image 3: How I would like it to be

Steps i use to compile:

  • ionic cordova resources
  • ionic cordova prepare android
  • ionic cordova build --release android
2

Why not make the icon transparent to remove the gray background? But to enlarge an icon you can try the css property called transform.

.icon {
  transform: scale(0.8);
}

Reference:

3

Tks @mikrochipkid, i don’t understand where to insert your code.
PS: I want resize the app icon. That icon localized on mobile screen.

icon-screen

Where is a part of my config.xml:

    <platform name="android">
        <icon density="ldpi" src="resources\android\icon\drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources\android\icon\drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources\android\icon\drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources\android\icon\drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources\android\icon\drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources\android\icon\drawable-xxxhdpi-icon.png" />
    </platform>
    <icon src="resources\android\icon\drawable-xhdpi-icon.png" />
4

Oh I thought you meant an icon in your app :grimacing:. Anyway open your app in Android studio and then Right click on the res folder and select New > Image Asset. Insert your image there and there’s a scaling option. Just move the slider to your liking.

Reference:

1 Like
5

I get it.
I do not use Android Studio, I compile directly by the command “ionic cordova build android”.
I will install it and test. Then I’ll communicate what I get.
Thanks a lot!