Skip to content

Instantly share code, notes, and snippets.

@twonjosh
Forked from ma11hew28/Create Icons.jsx
Last active April 25, 2023 08:41
Show Gist options
  • Save twonjosh/3681050 to your computer and use it in GitHub Desktop.
Save twonjosh/3681050 to your computer and use it in GitHub Desktop.
Photoshop Script to Create iOS Icons from a source image
// Photoshop Script to Create iPhone Icons from iTunesArtwork
//
// WARNING!!! In the rare case that there are name collisions, this script will
// overwrite (delete perminently) files in the same folder in which the selected
// iTunesArtwork file is located. Therefore, to be safe, before running the
// script, it's best to make sure the selected iTuensArtwork file is the only
// file in its containing folder.
//
// Copyright (c) 2010 Matt Di Pasquale
// Added tweaks Copyright (c) 2012 by Josh Jones http://www.appsbynight.com
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
//
// Prerequisite:
// First, create at least a 1024x1024 px PNG file according to:
// http://developer.apple.com/library/ios/#documentation/iphone/conceptual/iphoneosprogrammingguide/BuildTimeConfiguration/BuildTimeConfiguration.html
//
// Install - Save Create Icons.jsx to:
// Win: C:\Program Files\Adobe\Adobe Utilities\ExtendScript Toolkit CS5\SDK
// Mac: /Applications/Utilities/Adobe Utilities/ExtendScript Toolkit CS5/SDK
// * Restart Photoshop
//
// Update:
// * Just modify & save, no need to resart Photoshop once it's installed.
//
// Run:
// * With Photoshop open, select File > Scripts > Create Icons
// * When prompted select the prepared iTunesArtwork file for your app.
// * The different version of the icons will get saved to the same folder that
// the iTunesArtwork file is in.
//
// Adobe Photoshop JavaScript Reference
// http://www.adobe.com/devnet/photoshop/scripting.html
// Turn debugger on. 0 is off.
// $.level = 1;
try
{
// Prompt user to select iTunesArtwork file. Clicking "Cancel" returns null.
var iTunesArtwork = File.openDialog("Select a sqaure PNG file that is at least 1024x1024.", "*.png", false);
if (iTunesArtwork !== null)
{
var doc = open(iTunesArtwork, OpenDocumentType.PNG);
if (doc == null)
{
throw "Something is wrong with the file. Make sure it's a valid PNG file.";
}
var startState = doc.activeHistoryState; // save for undo
var initialPrefs = app.preferences.rulerUnits; // will restore at end
app.preferences.rulerUnits = Units.PIXELS; // use pixels
if (doc.width != doc.height)
{
throw "Image is not square";
}
else if ((doc.width < 1024) && (doc.height < 1024))
{
throw "Image is too small! Image must be at least 1024x1024 pixels.";
}
else if (doc.width < 1024)
{
throw "Image width is too small! Image width must be at least 1024 pixels.";
}
else if (doc.height < 1024)
{
throw "Image height is too small! Image height must be at least 1024 pixels.";
}
// Folder selection dialog
var destFolder = Folder.selectDialog( "Choose an output folder");
if (destFolder == null)
{
// User canceled, just exit
throw "";
}
// Save icons in PNG using Save for Web.
var sfw = new ExportOptionsSaveForWeb();
sfw.format = SaveDocumentType.PNG;
sfw.PNG8 = false; // use PNG-24
sfw.transparency = true;
doc.info = null; // delete metadata
var icons = [
{"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-Small", "size":29},
{"name": "Icon-Small@2x", "size":58},
{"name": "Icon-Small-50", "size":50},
{"name": "Icon-Small-50@2x", "size":100}
];
var icon;
for (i = 0; i < icons.length; i++)
{
icon = icons[i];
doc.resizeImage(icon.size, icon.size, // width, height
null, ResampleMethod.BICUBICSHARPER);
var destFileName = icon.name + ".png";
if ((icon.name == "iTunesArtwork@2x") || (icon.name == "iTunesArtwork"))
{
// iTunesArtwork files don't have an extension
destFileName = icon.name;
}
doc.exportDocument(new File(destFolder + "/" + destFileName), ExportType.SAVEFORWEB, sfw);
doc.activeHistoryState = startState; // undo resize
}
alert("iOS Icons created!");
}
}
catch (exception)
{
// Show degbug message and then quit
if ((exception != null) && (exception != ""))
alert(exception);
}
finally
{
if (doc != null)
doc.close(SaveOptions.DONOTSAVECHANGES);
app.preferences.rulerUnits = initialPrefs; // restore prefs
}
@AS-OLD
Copy link

AS-OLD commented Jun 11, 2013

gayhub where is the download button

@jeffgomes
Copy link

Thank you! :-)

@zohaibrizvi
Copy link

Thanx a bunch!

@danoli3
Copy link

danoli3 commented Nov 12, 2013

iOS7 update? :D

@jlndk
Copy link

jlndk commented Feb 11, 2014

i have combined it with a other script to batch process all psds in a folder instead off just one png !! https://gist.github.com/jlndk/8498636

btw to @danoil3:
you can just edit the sizes and names in the array (line 106)

var icons = [
{"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-Small", "size":29},
{"name": "Icon-Small@2x", "size":58},
{"name": "Icon-Small-50", "size":50},
{"name": "Icon-Small-50@2x", "size":100}
];

@progrmr
Copy link

progrmr commented Sep 18, 2014

I have an updated version that does all the icons needed for the Xcode 6 AppIcons asset catalog, which includes iPhone 6 and 6 plus.
https://gist.github.com/progrmr/11146412

I would create a pull request to merge it back, but I'm not sure how to do that with gists.

@arnelceledonio
Copy link

Error: Cannot open the file because the open options are incorrect

@kiwi07
Copy link

kiwi07 commented Feb 7, 2015

I got an pop-up error when I try to export using this script:
"Could not complete this operation. There are no user slices"

I'm using PS CS6, Mac OS 10.10.1

Please help!

@RichardBronosky
Copy link

arnelceledonio,
If you get "Error: Cannot open the file because the open options are incorrect" that's probably because you are opening a non-png.

Change line 62 to be:

var doc = open(iTunesArtwork);

and it will open any filetype. I've made this change as well as those from progrmr above in my fork: https://gist.github.com/RichardBronosky/ee9d4e743c74303492e0/

@alexsdesign
Copy link

2016 File Sizes: I've updated this script with the latest image dimensions and sizes required by Apple.
You can get it from here:

https://gist.github.com/alexsdesign/b5edf00588750023302f

I'll be rehashing this script in a bit to create one for loading images / splash images and preview images soon.

@colus001
Copy link

colus001 commented Jul 7, 2016

@tonsnoei
Copy link

Nice script.

One note:
else if (doc.width < 1024)
else if (doc.height < 1024)
Both will not occur because previously the square check is done.

@patrickschmelter
Copy link

new file sizes

var icons = [
  {"name": "App Store",                       "size":1024},
  {"name": "iPad App 7-11",                   "size":76},
  {"name": "iPad App 7-11@2x",                "size":76*2},
  {"name": "iPad Pro App 9-11@2x",            "size":83.5*2},
  {"name": "iPad Spotlight 7-11",             "size":40},
  {"name": "iPad Spotlight 7-11@2x",          "size":40*2},
  {"name": "iPad Settings 5-11",              "size":29},
  {"name": "iPad Settings 5-11@2x",           "size":29*2},
  {"name": "iPad Notifications 7-11",         "size":20},
  {"name": "iPad Notifications 7-11@2x",      "size":20*2},
  {"name": "iPhone App 7-11@2x",              "size":60*2},
  {"name": "iPhone App 7-11@3x",              "size":60*3},
  {"name": "iPhone Spotlight 7-11@2x",        "size":40*2},
  {"name": "iPhone Spotlight 7-11@3x",        "size":40*3},
  {"name": "iPhone Settings 5-11@2x",         "size":29*2},
  {"name": "iPhone Settings 5-11@3x",         "size":29*3},
  {"name": "iPhone Notification@2x",          "size":20*2},
  {"name": "iPhone Notification@3x",          "size":20*3}
];

@jakob-e
Copy link

jakob-e commented Nov 28, 2017

@twonjosh 👍 Thanks for sharing and @patrickschmelter for the update - maybe add watch, mac and iTunes Artwork too (based on xamarin asset)

     var icons = [
      {"name": "App Store",                          "size":1024},
      
      {"name": "iPad App 7-11",                      "size":76},
      {"name": "iPad App 7-11@2x",                   "size":76*2},
      {"name": "iPad Pro App 9-11@2x",               "size":83.5*2},
      {"name": "iPad Spotlight 7-11",                "size":40},
      {"name": "iPad Spotlight 7-11@2x",             "size":40*2},
      {"name": "iPad Settings 5-11",                 "size":29},
      {"name": "iPad Settings 5-11@2x",              "size":29*2},
      {"name": "iPad Notifications 7-11",            "size":20},
      {"name": "iPad Notifications 7-11@2x",         "size":20*2},
      
      {"name": "iPhone App 7-11@2x",                 "size":60*2},
      {"name": "iPhone App 7-11@3x",                 "size":60*3},
      {"name": "iPhone Spotlight 7-11@2x",           "size":40*2},
      {"name": "iPhone Spotlight 7-11@3x",           "size":40*3},
      {"name": "iPhone Settings 5-11@2x",            "size":29*2},
      {"name": "iPhone Settings 5-11@3x",            "size":29*3},
      {"name": "iPhone Notification@2x",             "size":20*2},
      {"name": "iPhone Notification@3x",             "size":20*3},

      {"name": "iTunes Artwork",                     "size":512},
      {"name": "iTunes Artwork@2x",                  "size":512*2},

      {"name": "Apple Watch Notifications 38mm@2x",  "size":48},
      {"name": "Apple Watch Notifications 42mm@2x",  "size":55},
      {"name": "Apple Watch Settings@2x",            "size":58},    
      {"name": "Apple Watch Settings@3x",            "size":87},   
      {"name": "Apple Watch Home Screen",            "size":80},   
      {"name": "Apple Watch Long Look@2x",           "size":88},         
      {"name": "Apple Watch Short Look 38mm@2x",     "size":172},         
      {"name": "Apple Watch Short Look 42mm@2x",     "size":196}, 

      {"name": "Mac 16pt",                           "size":16},         
      {"name": "Mac 16pt@2x",                        "size":16*2},         
      {"name": "Mac 32pt",                           "size":32},         
      {"name": "Mac 32pt@2x",                        "size":32*2},         
      {"name": "Mac 128pt",                          "size":128},         
      {"name": "Mac 128pt@2x",                       "size":128*2},         
      {"name": "Mac 256pt",                          "size":256},         
      {"name": "Mac 256pt@2x",                       "size":256*2},               
      {"name": "Mac 512pt",                          "size":512},         
      {"name": "Mac 512pt@2x",                       "size":512*2}               

    ];

@NicoDos
Copy link

NicoDos commented May 22, 2018

Here are sizes for IOS apps created with NativeScript:

var icons = [
      {"name": "icon-1024", "size":1024},
      {"name": "icon-83.5@2x", "size":83.5*2},
      {"name": "icon-76@2x", "size":76},
      {"name": "icon-76", "size":76},
      {"name": "icon-60@3x", "size":60*3},
      {"name": "icon-60@2x", "size":60*2},
      {"name": "icon-40@3x", "size":40*3},
      {"name": "icon-40@2x", "size":40*2},
      {"name": "icon-40", "size":40},
      {"name": "icon-29@3x", "size":29*3},
      {"name": "icon-29@2x", "size":29*2},
      {"name": "icon-29", "size":29}
    ];

@ctrevarthen
Copy link

Adding in 44mm Watch sizes:

     var icons = [
      {"name": "App Store",                          "size":1024},
      
      {"name": "iPad App 7-11",                      "size":76},
      {"name": "iPad App 7-11@2x",                   "size":76*2},
      {"name": "iPad Pro App 9-11@2x",               "size":83.5*2},
      {"name": "iPad Spotlight 7-11",                "size":40},
      {"name": "iPad Spotlight 7-11@2x",             "size":40*2},
      {"name": "iPad Settings 5-11",                 "size":29},
      {"name": "iPad Settings 5-11@2x",              "size":29*2},
      {"name": "iPad Notifications 7-11",            "size":20},
      {"name": "iPad Notifications 7-11@2x",         "size":20*2},
      
      {"name": "iPhone App 7-11@2x",                 "size":60*2},
      {"name": "iPhone App 7-11@3x",                 "size":60*3},
      {"name": "iPhone Spotlight 7-11@2x",           "size":40*2},
      {"name": "iPhone Spotlight 7-11@3x",           "size":40*3},
      {"name": "iPhone Settings 5-11@2x",            "size":29*2},
      {"name": "iPhone Settings 5-11@3x",            "size":29*3},
      {"name": "iPhone Notification@2x",             "size":20*2},
      {"name": "iPhone Notification@3x",             "size":20*3},

      {"name": "iTunes Artwork",                     "size":512},
      {"name": "iTunes Artwork@2x",                  "size":512*2},

      {"name": "Apple Watch Notifications 38mm@2x",  "size":48},
      {"name": "Apple Watch Notifications 42mm@2x",  "size":55},
      {"name": "Apple Watch Settings@2x",            "size":58},    
      {"name": "Apple Watch Settings@3x",            "size":87},   
      {"name": "Apple Watch Home Screen 38mm@2x",    "size":80},
      {"name": "Apple Watch Home Screen 40mm@2x",    "size":88}, 
      {"name": "Apple Watch Home Screen 44mm@2x",    "size":100},    
      {"name": "Apple Watch Long Look@2x",           "size":88},         
      {"name": "Apple Watch Short Look 38mm@2x",     "size":172},         
      {"name": "Apple Watch Short Look 42mm@2x",     "size":196},
      {"name": "Apple Watch Short Look 44mm@2x",     "size":216}, 

      {"name": "Mac 16pt",                           "size":16},         
      {"name": "Mac 16pt@2x",                        "size":16*2},         
      {"name": "Mac 32pt",                           "size":32},         
      {"name": "Mac 32pt@2x",                        "size":32*2},         
      {"name": "Mac 128pt",                          "size":128},         
      {"name": "Mac 128pt@2x",                       "size":128*2},         
      {"name": "Mac 256pt",                          "size":256},         
      {"name": "Mac 256pt@2x",                       "size":256*2},               
      {"name": "Mac 512pt",                          "size":512},         
      {"name": "Mac 512pt@2x",                       "size":512*2}               

    ];

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment