Some of my app icons are changing from square to round (I only use Android, so I’m not sure if this is only an Android thing or not).
My app icon that I’m loading is a square png file, but on my device, the icon is showing as a circle (so part of it is getting cut off). Some icons are staying as square, but some aren’t. I’m not sure how the editor is interpreting what should be square vs circle, but some insight into how to maintain a square aspect ratio for the app icon would be appreciated!
I do notice that there is that difference of square vs. round when you select List vs. Compact List. I’m sure you have seen this and this is not your case but I figured I would mention it.
Yup I’ve seen that before too, which isn’t a huge deal for me, but has presented a bit of a design struggled from time to time.
For my issue, it’s just related to the icon that gets loaded onto the user’s phone to access the app. My uploaded icon is square, but it’s showing up as round on my device’s homescreen. The documentation says that SVG format is best for app icons, so I converted my PNG to SVG to see if that made a difference, but it’s still coming up as round on my device.
We implemented support for icon masking that Google Chrome just shipped last week. This allows android to change the shape of your app’s icon to fit in with the other apps on the users device, whether they are square, rounded rectangles, circles, teardrops, or any other shape. For the time being this means for optimal results you should include some margin around the content of your icon, so when the icon is cropped on an android device it looks better. We will implement some changes to make it easier for you to control this in the long run.