Replicate Resize

Replicate Resize #

Generate Icon Assets #

Replicate Resize helps you automatically generate icon assets from one single large image file. Simply drag and drop your large image file (preferably 1024x1024 pixels) to the app and choose your output platform and format.

iOS Icon Assets #

For iOS, the app outputs an AppIcon.appiconset folder with a Contents.json and corresponding icon files in various sizes. The JSON file contains:

{
  "images": [
    {
      "scale": "2x",
      "size": "20x20",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "20x20",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "29x29",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "29x29",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "40x40",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "40x40",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "60x60",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "60x60",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "20x20",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "20x20",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "29x29",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "29x29",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "40x40",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "40x40",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "76x76",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "76x76",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "83.5x83.5",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "1024x1024",
      "idiom": "ios-marketing",
      "filename": "icon_rect_1024.png"
    }
  ],
  "properties": {},
  "info": {
    "version": 1,
    "author": "xcode"
  }
}

Android Icon Assets #

The app provides two different templates for Android icons. The traditional template resizes icons in three different folders:

  • drawable-hdpi/icon.png at 72x72 pixels
  • drawable-xhdpi/icon.png at 96x96 pixels
  • drawable-xxhdpi/icon.png at 144x144 pixels

Android Adaptive Icons #

You can generate adaptive icons for Android with the app. The output structure is:

  • drawable-anydpi-v26/icon.xml
  • drawable-anydpi-v26/icon_fg.png

Use transparent icons as the input and edit the icon.xml file to set the background color:

<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon
    xmlns:android="http://schemas.android.com/apk/res/android">
  <background android:drawable="#FFFFFF"/>
  <foreground android:drawable="@drawable/icon_fg" />
</adaptive-icon>

Apple Watch Icons #

Apple Watch icon set generation is very similar to iOS. The output JSON file contains:

{
  "images": [
    {
      "scale": "2x",
      "size": "20x20",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "20x20",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "29x29",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "29x29",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "40x40",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "40x40",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "60x60",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "3x",
      "size": "60x60",
      "idiom": "iphone",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "20x20",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "20x20",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "29x29",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "29x29",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "40x40",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "40x40",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "76x76",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "76x76",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "2x",
      "size": "83.5x83.5",
      "idiom": "ipad",
      "filename": "[email protected]"
    },
    {
      "scale": "1x",
      "size": "1024x1024",
      "idiom": "ios-marketing",
      "filename": "icon_rect_1024.png"
    }
  ],
  "properties": {},
  "info": {
    "version": 1,
    "author": "xcode"
  }
}

iPhone and iPad Screenshots #

You can quickly resize images to iPhone and iPad screenshot dimensions required by App Store. Simply load the base screenshot and choose the desired output format to generate the resized screenshot.