What are the corner-radii for app icons?

Discussion in 'Public Game Developers Forum' started by BrettArchibald, Jan 21, 2009.

  1. Adams Immersive

    Adams Immersive Well-Known Member
    Patreon Bronze

    Dec 5, 2008
    1,718
    5
    38
    Freelance interactive design and programming
    Ohio
    #21 Adams Immersive, Mar 10, 2009
    Last edited: Mar 10, 2009
    90

    I hate to say it... but the real answer I believe is 90.

    I read that iPhone home icons are 57x57 with a 10-pixel radius. If correct, that comes to 90 pixels (well, 89.8) when working at 512.

    So I tested that out, and I believe it to be correct:

    * I filled a 20-pixel circle (radius 10) and line it up alongside the corners of icons from an iPhone screen grab. Perfect match.

    * I grabbed a super-size icon from an iPhone screen in Apple's PR area and scaled it up to fit my Photoshop icon template. I tried overlaying your 100-pixel corners on it, and they looked too round. 90 pixels looked good.

    (Or rather, 180 in my case, since I build at 1024x1024.)

    BTW, I've only built iPhone favicons (apple-touch-icons) which always have Apple's bevel and shine. If I were making a real app icon, I assume you have the choice to omit the bevel/shine and use your image as-is (minus corners)?

    Also, FWIW, to make a 1-pixel line at 57x57 (home screen size), use 9 pixels (on a 512x512 document). To make a 2-pixel line, use 18 pixels.

    In other words, whatever you want at home-screen-size, multiply by 9 when working at 512x512.

    (These values are slightly rounded and will work best at the very edge of the icon.)
     

Share This Page