Create Every iOS Icon For Your App With a Photoshop Script

When you create any kind of app that will go on Apple’s App Store, they require you to have an icon for your app. Well because of the number of different devices and resolutions out there, you’ll need multiple copies of this icon before submission. This script can do that for you in a few seconds!

What Are the Icons For?

Here is a chart that explains the current icons:

File Name Size Device(s) Purpose
Icon.png 57 x 57 iPhone/iPod Touch Home Screen App Icon
Icon@2x.png 114 x 114 iPhone/iPod Touch
(Retina)
Home Screen App Icon
Icon-72.png 72 x 72 iPad Home Screen App Icon
Icon-72@2x.png 144 x 144 iPad (Retina) Home Screen App Icon
Icon-Small.png 29 x 29 iPhone/iPod Touch, iPad Spotlight Search Results
and Settings
(Settings for iPad)
Icon-Small@2x.png 58 x 58 iPhone/iPod Touch, iPad
(Retina)
Spotlight Search Results
and Settings
(Settings for iPad)
Icon-Small-50.png 50 x 50 iPad Spotlight Search Results
Icon-Small-50@2x.png 100 x 100 iPad (Retina) Spotlight Search Results
ItunesArtwork
(no extension)
512 x 512 iPhone/iPod Touch/iPad App Store
ItunesArtwork@2x
(no extension)
1024 x 1024 iPhone/iPod Touch/iPad App Store (Retina)

Requirements

In order to do this you’re going to need:

  • Photoshop
  • A square PNG image 1024×1024 or greater
  • The script itself which can be downloaded from here.

Usage

The script itself it just a text file with a funky extension that Adobe products understand. To use this in Photoshop you’re going to want to place it in the Photoshop scripts directory.

On Mac that’s usually located: Applications/Adobe Photoshop CS6/Presets/Scripts (Or whatever your version of Photoshop is)

Mac OS Photoshop Script Location

On Windows that’s usually located at: C:\Program Files\Adobe\Adobe Photoshop CS6 (64 Bit)\Presets\Scripts

Windows Photoshop Script Location

One you place the file here, load up Photoshop and look under “File -> Scripts” and you should see “Create iOS Icons”

Here is a video showing how it works in action:

Final Notes

The original script was created by Matt Di Pasquale who shared it on GitHub 2 years ago. I added some extra checks, a couple missing icons, and the ability to output to a file.

If you find this script useful, please let me know! Feel free to “fork” it, as they say in GitHub land. I’m sure this could also be automated to be part of the Xcode build process as well, but I’ll leave that as a project for another day. ;)


13 Comments → “Create Every iOS Icon For Your App With a Photoshop Script”


  1. Alex

    1 year ago

    Thanks a million! Saved me many clicks and renames!

    Reply

  2. Kevin

    1 year ago

    This is a great tool. Thanks saved me lots of time.

    Reply

  3. Cale

    1 year ago

    This script was working fine for me initially, but now for some reason, the icons are not coming out with transparent edges. Have you encountered this before?

    Reply

    • Cale

      1 year ago

      I changed this: sfw.transparency = false;

      to: sfw.transparency = true;

      seems to work fine.

      Reply

  4. David Henderson

    1 year ago

    Cool, just noticed it was updated 4 hrs ago, I already downloaded. Many thanks for this Josh.
    Now all I need to find is an action that will make them into glossy/shaded app icons, you know the kind

    Reply

    • Scott West

      1 year ago

      XCode already does this automatically unless you select Pre-Rendered.

      Reply

  5. Mandy Robinson

    7 months ago

    Thanks very much, this is fantastic! All icons sized and named correctly. Now all I need is to find something like this for Android.

    Reply

  6. Alejandro

    7 months ago

    Would be great to have support to iOS 7 (icons are a little bigger). Instead os 114px now are 120px and so on, take a look at: http://blog.manbolo.com/2013/08/15/new-metrics-for-ios-7-app-icons

    Reply

  7. sivan lutaty

    7 months ago

    Thanks!
    can i edit it to add more sizes (for ios7)?

    Reply

  8. Bill

    6 months ago

    This is great. Added a few new sizes for iPad.

    {“name”: “iTunesArtwork@2x”, “size”:1024},
    {“name”: “iTunesArtwork”, “size”:512},
    {“name”: “Icon”, “size”:57},
    {“name”: “Icon@2x”, “size”:114},
    {“name”: “Icon-72″, “size”:72},
    {“name”: “Icon-72@2x”, “size”:144},
    {“name”: “Icon-76″, “size”:76},
    {“name”: “Icon-76@2x”, “size”:152},
    {“name”: “Icon-Small”, “size”:29},
    {“name”: “Icon-Small@2x”, “size”:58},
    {“name”: “Icon-Small-40″, “size”:40},
    {“name”: “Icon-Small-40@2x”, “size”:80},
    {“name”: “Icon-Small-50″, “size”:50},
    {“name”: “Icon-Small-50@2x”, “size”:100}

    Reply

  9. Jean

    4 months ago

    Great thanks for this. saves lots of hassle. Any chance you can do one for splash screens ;-)

    Reply

Leave a Reply

Follow us!

Twitter RSS Feed
Read previous post:
App.net Logo
The Excitement of App.net

If you're immersed in the online social media world enough, you might have heard of "App.net" or at least scrolled...

Close