iOS icon template for Illustrator CS5+

06 Jul 2010

With the iPad and iPhone 4, there are as many, if not more, different size icons to create for iOS than there are for desktop apps. While there are plenty of templates and reference sheets for Photoshop users (see Cocoia) I prefer to use Illustrator CS5 to create mine. So I’ve made my own template, and it’s available here if you find it useful too!

Download the iOS icon template for Illustrator CS5

Screenshot of the iOS4 template

Layers and Artboards screenshotThe top layer of the file contains labels and a mask to add the rounded corners of the icon. Don’t forget to hide these before you export.

Corner Radius

Something that Apple doesn’t include in it’s documentation are the various corner radius dimensions for all the icon sizes. This information has been compiled thanks to investigations of Sarah Parmenter and Tim Van Damme.

It’s best to create the artwork with 90° corners and let the OS round them off, but there is a mask layer to help you check how it would look. The mask also uses the appropriate colour for the context – white for the app store, black for the home screen and light grey for the spotlight results.

Also the icon that iOS uses for spotlight results on the iPad is trimmed by 1px around the edge. So while the artwork still needs to be supplied as 50px, the visible area is only 48px, and the guides reflect that, while the rounded corner mask stays at 50px.

Exporting

The icons are all set out on their own artboard, so when you’re ready to export check the ‘Use Artboards’ option to get each icon as an individual file:

Export

Disclaimer

While I’ve worked hard to make sure this template is as accurate as possible, I can’t guarantee it’s completely error-free. Let me know if you find any bugs, and I’ll update it!

If you’re using CS4 or below, this template may well work for you, but hasn’t been tested and may explode leaving terrible stains. I target CS5 because of it’s the first version that has pixel snapping that actually works!

Recent Posts

The Hicks Logowall

05 Oct 2018

Hiding Away

16 Sep 2018

Biro sketch of Lauzerte

23 Aug 2018

Firefox Identity Project

21 Aug 2018

It’s just fashion

26 Jun 2018

The Symbol Sourcebook

08 Jun 2018

Differences between Icon and Logo Design on This is HCD Podcast

10 Apr 2018

Twelve South PencilSnap

01 Apr 2018

The Infinite Canvas

09 Feb 2018

Instagram Hickstagram

  • 20 Oct 2018

    Inktober Day 20: quick doodle without planning in pencil or looking at reference, which is usually a bad idea. Your turn @hicksmade! #inktober #inktober2018 #leighandjondoinktober

  • 20 Oct 2018

    Morning dog walk. Even the wheelie bins looked good in this light

  • 20 Oct 2018

    Inktober Day 19. Following @hicksmade’s marshmallows with more marshmallows 🤪 #inktober #inktober2018 #leighandjondoinktober #ghostbusters #staypuft

  • 18 Oct 2018

    Inktober Day 18. When @hicksmade did a prawn I was sure she was setting me up to do cocktails! #inktober #inktober2018 #leighandjondoinktober #cocktails

  • 18 Oct 2018

  • 18 Oct 2018

  • 18 Oct 2018

    Inktober day 17 . @hicksmade’s pen led me onto squid and their ink shooting abilities. I also found out that a part of the squids anatomy is called a ‘pen’. #inktober #inktober2018 #ink #leighandjondoinktober

  • 16 Oct 2018

    Inktober day 16 “The Pilot” - a response to @hicksmade’s barber shop poster. Experimenting with a different style on this one #inktober #inktober2018 #leighandjondoinktober #pilot

  • 15 Oct 2018

    Inktober Day 15. @hicksmade’s staircase led me to this. There must be a hairdressers somewhere called this? #inktober #inktober2018 #leighandjondoinktober #hairwaytosteven

  • 14 Oct 2018

    Inktober day 14 - from @hicksmade’s theme of escape, and tonight’s Dr Who, with a return to classic theme: running!. #inktober #inktober2018 #leighandjondoinktober #drwho #pictogram #signage

Contact us

Call Jon on +44 (0)7917 391536, email or tweet @hicksdesign.

Alternatively, pop in for tea and cake at the studio…

Hicks
Wenrisc House
Meadow Court
Witney, OX28 6ER
United Kingdom