13

Are there any official guidelines for how many pixels the edge radii should be when giving Android launcher icons rounded corners?

I've found guidelines for launcher icon pixel sizes (but rounded corners aren't mentioned), a tool called Android Asset Studio which rounds the corners for you (but the tool provides undesirable and non-configurable padding around the edges of each icon), and another tool called Icon Slayer (but the tool creates corners that I feel are way too round, and feel very iOS).

I've also noticed that of all the apps that I personally use that have rounded corners on their launcher icons, the edge radii almost always seem to vary from icon to icon. When I place the various icons next to each other, some look pretty close, but they mostly feel just a little bit off from each other.

Any help?

Community
  • 1
  • 1
Luke
  • 1,962
  • 1
  • 15
  • 26
  • 1
    The way I approach this is create the icon in 512x512 with the rounded corner look you are looking for. There is no official radius so choose what you feel looks correct. From there, scale to the various sizes for screen densities. – Dan Harms Jul 06 '15 at 20:50

3 Answers3

21

Check out Google's official Material Design guidelines for Icons about two thirds of the way down the page under the sub-heading Corners.
It indicates you should use a 2px radius on the corners. If go up a few sections, under the heading Content Area you'll see this is for a 24x24 px icon. You can scale up for other resolutions from there.

Sound Conception
  • 5,006
  • 4
  • 25
  • 46
  • 7
    Good advice, @Sound Conception. By scaling appropriately, we get the following: LDPI should be 36 x 36 = 3px radius, MDPI should be 48 x 48 = 4px radius, TVDPI should be 64 x 64 = 5px radius, HDPI should be 72 x 72 = 6px radius, XHDPI should be 96 x 96 = 8px radius, XXHDPI should be 144 x 144 = 12px radius, XXXHDPI should be 192 x 192 = 16px radius. – Luke Jul 07 '15 at 18:04
18

The radius of the corners should be 8.33% of the size of the icon according to Materiel guidelines.

So if the size of the icon in your project is: 1000px by 1000px, then the corner radius should be 83.3px.

However, you should probably make your document bigger than that. Maybe 2000px by 2000px, and the radius:

  • 2000px * 0.0833 = 166.6px

This is just in case you need to export a version of your icon that is bigger than 1k px.

Jose Miralles
  • 362
  • 3
  • 10
0

Squares and rectangles on 192x192 px grid, when used as background shapes for android product icon, should always have 12px radius corners.

Read details

Shahidul
  • 2,489
  • 1
  • 18
  • 20