I'm looking for a tool that can generate the different sizes of icons for the iOS and Android apps from a svg
image.
Google hasn't been really able to provide me with any "one-click" solution. Are there any tools out there which are less well known? or perhaps some simple batch scripts that achieve the same?
Ideally something I could run on my windows 10 machine, but linux would work too.
My choice is https://github.com/sterlp/svg2png. For IOS:
java -jar svg2png.jar -f app_icon.svg -o yourFolder/Assets.xcassets/AppIcon.appiconset -c ios_icon.json
With ios_icon.json like that:
{
"files": [
{
"nameSuffix": "-20x20@1x",
"height": 20,
"width": 20
},
{
"nameSuffix": "-20x20@2x",
"height": 40,
"width": 40
},
{
"nameSuffix": "-20x20@3x",
"height": 60,
"width": 60
},
{
"nameSuffix": "-29x29@1x",
"height": 29,
"width": 29
},
{
"nameSuffix": "-29x29@2x",
"height": 58,
"width": 58
},
{
"nameSuffix": "-29x29@3x",
"height": 87,
"width": 87
},
{
"nameSuffix": "-40x40@1x",
"height": 40,
"width": 40
},
{
"nameSuffix": "-40x40@2x",
"height": 80,
"width": 80
},
{
"nameSuffix": "-40x40@3x",
"height": 120,
"width": 120
},
{
"nameSuffix": "-60x60@2x",
"height": 120,
"width": 120
},
{
"nameSuffix": "-60x60@3x",
"height": 180,
"width": 180
},
{
"nameSuffix": "-76x76@1x",
"height": 76,
"width": 76
},
{
"nameSuffix": "-76x76@2x",
"height": 152,
"width": 152
},
{
"nameSuffix": "-83.5x83.5@2x",
"height": 167,
"width": 167
},
{
"nameSuffix": "-1024x1024@1x",
"height": 1024,
"width": 1024
}
]
}
Just make sure generated png files match your configuration from AppIcon.appiconset/Contents.json. Mine is
{
"images" : [
{
"idiom" : "iphone",
"scale" : "2x",
"size" : "20x20",
"filename" : "app_icon-20x20@2x.png"
},
{
"idiom" : "iphone",
"scale" : "3x",
"size" : "20x20",
"filename" : "app_icon-20x20@3x.png"
},
{
"idiom" : "iphone",
"scale" : "2x",
"size" : "29x29",
"filename" : "app_icon-29x29@2x.png"
},
{
"idiom" : "iphone",
"scale" : "3x",
"size" : "29x29",
"filename" : "app_icon-29x29@3x.png"
},
{
"idiom" : "iphone",
"scale" : "2x",
"size" : "40x40",
"filename" : "app_icon-40x40@2x.png"
},
{
"idiom" : "iphone",
"scale" : "3x",
"size" : "40x40",
"filename" : "app_icon-40x40@3x.png"
},
{
"idiom" : "iphone",
"scale" : "2x",
"size" : "60x60",
"filename" : "app_icon-60x60@2x.png"
},
{
"idiom" : "iphone",
"scale" : "3x",
"size" : "60x60",
"filename" : "app_icon-60x60@3x.png"
},
{
"idiom" : "ipad",
"scale" : "1x",
"size" : "20x20",
"filename" : "app_icon-20x20@1x.png"
},
{
"idiom" : "ipad",
"scale" : "2x",
"size" : "20x20",
"filename" : "app_icon-20x20@2x.png"
},
{
"idiom" : "ipad",
"scale" : "1x",
"size" : "29x29",
"filename" : "app_icon-29x29@1x.png"
},
{
"idiom" : "ipad",
"scale" : "2x",
"size" : "29x29",
"filename" : "app_icon-29x29@2x.png"
},
{
"idiom" : "ipad",
"scale" : "1x",
"size" : "40x40",
"filename" : "app_icon-40x40@1x.png"
},
{
"idiom" : "ipad",
"scale" : "2x",
"size" : "40x40",
"filename" : "app_icon-40x40@2x.png"
},
{
"idiom" : "ipad",
"scale" : "1x",
"size" : "76x76",
"filename" : "app_icon-76x76@1x.png"
},
{
"idiom" : "ipad",
"scale" : "2x",
"size" : "76x76",
"filename" : "app_icon-76x76@2x.png"
},
{
"idiom" : "ipad",
"scale" : "2x",
"size" : "83.5x83.5",
"filename" : "app_icon-83.5x83.5@2x.png"
},
{
"idiom" : "ios-marketing",
"scale" : "1x",
"size" : "1024x1024",
"filename" : "app_icon-1024x1024@1x.png"
}
],
"info" : {
"author" : "xcode",
"version" : 1
}
}
For Android please refer to README on https://github.com/sterlp/svg2png or create your own json config.