1. Services
    2. ›
  2. Image Manipulation
    3. ›

The /image/resize Robot

We can resize, crop, and (auto-)rotate images, as well as watermark them.

The /image/resize Robot resizes, crops, changes colorization, rotation, and applies text and watermarks to images.

Parameters

Name Type Default Description
format String Auto Some of the most important available formats are "jpg", "png", "gif", "tiff" and "pdf". For a complete lists of all formats that we can write to please check our supported image formats list. If this parameter is not specified it will default to the format of the input image
width Integer(1-5000) Auto Width of the new image, in pixels. If not specified, will default to the width of the input image
height Integer(1-5000) Auto Height of the new image, in pixels. If not specified, will default to the height of the input image
resize_strategy String "fit" See the list of available resize strategies.
zoom Boolean true If this is set to false, smaller images will not be stretched to the desired width and height. For details about the impact of zooming for your preferred resize strategy, see the list of available resize strategies.
crop Object / JSON String null Specify an object containing coordinates for the top left and bottom right corners of the rectangle to be cropped from the original image(s). For example: 
{
  x1: 80,
  y1: 100,
  x2: 160,
  y2: 180
}
will crop the area from (80, 100) to (160, 180) which is a square whose width and height are 80px. If crop is set, the width and height parameters are ignored, and the resize_strategy is set to crop automatically. You can also use a JSON string of such an object with coordinates in similar fashion: "{ \"x1\": <Integer>, \"y1\": <Integer>, \"x2\": <Integer>, \"y2\": <Integer> }" To crop around human faces, see our /image/facedetect Robot.
gravity String center The direction from which the image is to be cropped, when "resize_strategy" is set to "crop", but no crop coordinates are defined. The available options are "center", "top", "bottom", "left", and "right". You can also combine options with a hyphen, such as "bottom-right".
strip Boolean false Strips all metadata from the image. This is useful to keep thumbnails as small as possible.
alpha string "" Gives control of the alpha/matte channel of an image. Valid options are "Activate", "Background", "Copy", "Deactivate", "Extract", "Off", "On", "Opaque", "Remove", "Set", "Shape", "Transparent"
preclip_alpha string "" Gives control of the alpha/matte channel of an image before applying the clipping path via clip: true. Valid options are "Activate", "Background", "Copy", "Deactivate", "Extract", "Off", "On", "Opaque", "Remove", "Set", "Shape", "Transparent"
flatten Boolean true Flattens all layers onto the specified background to achieve better results from transparent formats to non-transparent formats, as explained in the ImageMagick documentation. To preserve animations, GIF files are not flattened when this is set to true. To flatten GIF animations, use the frame parameter.
correct_gamma Boolean false Prevents gamma errors common in many image scaling algorithms.
quality Integer(1-100) Quality Controls the image compression for JPG and PNG images. Please also take a look at our /image/optimize Robot.
Before:


Quality 92 applied:


Quality 40 applied:


If this parameter is not specified it will default to the quality of the input image, or 92
background String "#FFFFFF" Either the hexadecimal code or name of the color used to fill the background (only used for the pad resize strategy). By default, the background of transparent images is changed to white. For details about how to preserve transparency across all image types, see this demo.
frame Integer / Null null Use this parameter when dealing with animated GIF files to specify which frame of the GIF is used for the operation. Specify 1 to use the first frame, 2 to use the second, and so on. null means all frames.
colorspace String "" Sets the image colorspace. For details about the available values, see the ImageMagick documentation. Please note that if you were using "RGB", we recommend using "sRGB" instead as of 2014-02-04. ImageMagick might try to find the most efficient colorspace based on the color of an image, and default to e.g. "Gray". To force colors, you might then have to use this parameter in combination with type "TrueColor"
type String "" Sets the image color type. For details about the available values, see the ImageMagick documentation. If you're using colorspace, ImageMagick might try to find the most efficient based on the color of an image, and default to e.g. "Gray". To force colors, you could e.g. set this parameter to "TrueColor"
sepia Integer(0-99) / Null null Sets the sepia tone in percent.
Before:


After setting sepia to 90:


After setting sepia to 40:


After setting sepia to 10:
rotation String / Boolean / Integer true Determines whether the image should be rotated. Set this to true to auto-rotate images that are rotated in a wrong way, or depend on EXIF rotation settings. You can also set this to an integer to specify the rotation in degrees. You can also specify "degrees" to rotate only when the image width exceeds the height (or "degrees" if the width must be less than the height). Specify false to disable auto-fixing of images that are rotated in a wrong way.
compress String / Null null Specifies pixel compression for when the image is written. Valid values are "None", "BZip", "Fax", "Group4", "JPEG", "JPEG2000", "Lossless", "LZW", "RLE", and "Zip". Compression is disabled by default. Please also take a look at our /image/optimize Robot.
blur String / Null null Specifies gaussian blur, using a value with the form {radius}x{sigma}. The radius value specifies the size of area the operator should look at when spreading pixels, and should typically be either "0" or at least two times the sigma value. The sigma value is an approximation of how many pixels the image is "spread"; think of it as the size of the brush used to blur the image. This number is a floating point value, enabling small values like "0.5" to be used.
progressive Boolean false Interlaces the image if set to true, which makes the image load progressively in browsers. Instead of rendering the image from top to bottom, the browser will first show a low-res blurry version of the images which is then quickly replaced with the actual image as the data arrives. This greatly increases the user experience, but comes at a cost of a file size increase by around 10%.
transparent String "" Make this color transparent within the image.
trim_whitespace Boolean false This determines if additional whitespace around the image should first be trimmed away. If you set this to true this parameter removes any edges that are exactly the same color as the corner pixels.
clip Boolean / String false Apply the clipping path to other operations in the resize job, if one is present. If set to true, it will automatically take the first clipping path. If set to a String it finds a clipping path by that name.
negate Boolean false Replace each pixel with its complementary color, effectively negating the image. Especially useful when testing clipping.
density String null While in-memory quality and file format depth specifies the color resolution, the density of an image is the spatial (space) resolution of the image. That is the density (in pixels per inch) of an image and defines how far apart (or how big) the individual pixels are. It defines the size of the image in real world terms when displayed on devices or printed. You can set this value to a specific width or in the format widthxheight. If your converted image has a low resolution, please try using the density parameter to resolve that.
output_meta Object {} Allows you to specify a set of meta data that is more expensive on cpu power to calculate, and thus is disabled by default to keep your Assemblies processing fast. You can add "has_transparency": true in this object to extract if the image contains transparent parts.
See full docs

Live demos

Our /image/resize Robot can be used in combination with other Robots, to create powerful workflows unique to your use case.
Here are a few example scenarios, and the required the Assembly Instructions to implement them.
You can also try demos of these examples right here, live on our website.

Extract the cover art from an audio file

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "artwork_extracted": {
      "use": [":original"],
      "robot": "/audio/artwork",
      "result": true
    },
    "artwork_resized": {
      "use": ["artwork_extracted"],
      "robot": "/image/resize",
      "result": true,
      "height": 500,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fit",
      "width": 500,
      "zoom": false
    },
    "exported": {
      "use": ["artwork_extracted", "artwork_resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Take a screenshot of a website (by uploading an HTML file)

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "screenshot": {
      "use": [":original"],
      "robot": "/html/convert",
      "result": true
    },
    "resized": {
      "use": ["screenshot"],
      "robot": "/image/resize",
      "result": true,
      "gravity": "top",
      "height": 768,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fillcrop",
      "width": 1024,
      "zoom": false
    },
    "exported": {
      "use": ["screenshot", "resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Take a screenshot of a website automatically (by using a URL)

{
  "steps": {
    "screenshot": {
      "robot": "/html/convert",
      "result": true,
      "format": "png",
      "url": "https://uppy.io",
      "width": 1024
    },
    "resized": {
      "use": ["screenshot"],
      "robot": "/image/resize",
      "result": true,
      "gravity": "top",
      "height": 768,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fillcrop",
      "width": 1024,
      "zoom": false
    },
    "exported": {
      "use": ["screenshot", "resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Create a gzipped tar archive containing multiple result files

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "resized": {
      "use": [":original"],
      "robot": "/image/resize",
      "height": 100,
      "imagemagick_stack": "v1.0.0",
      "width": 100,
      "zoom": false
    },
    "archived": {
      "use": {"steps":[":original", "resized"],"bundle_steps":true},
      "robot": "/file/compress",
      "result": true,
      "format": "tar",
      "gzip": true
    },
    "exported": {
      "use": ["resized", "archived", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Extract all images from an archive and resize them

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "extracted": {
      "use": [":original"],
      "robot": "/file/decompress"
    },
    "resized": {
      "use": ["extracted"],
      "robot": "/image/resize",
      "result": true,
      "height": 200,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "pad",
      "width": 200,
      "zoom": false
    },
    "exported": {
      "use": ["extracted", "resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Apply a watermark to an image and store everything over SFTP

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "resized": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 500,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 500,
      "zoom": false
    },
    "watermarked": {
      "use": ["resized"],
      "robot": "/image/resize",
      "result": true,
      "format": "jpg",
      "imagemagick_stack": "v1.0.0",
      "watermark_position": "bottom-right",
      "watermark_size": "25%",
      "watermark_url": "http://demos.transloadit.com/inputs/transloadit-padded.png"
    },
    "exported": {
      "use": ["watermarked", ":original"],
      "robot": "/sftp/store",
      "credentials": "YOUR_CREDENTIALS",
      "path": "uploads/make/this/dir/if/you/!_like/${file.url_name}",
      "url_template": "http://sftp-demo.transloadit.com:81/make/this/dir/if/you/!_like/${file.url_name}"
    }
  }
}

Only resize larger images when resizing files

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "large_filtered": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "accepts": [["${file.meta.width}", ">", "2048"],["${file.meta.height}", ">", "2048"]],
      "condition_type": "or"
    },
    "smaller_filtered": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "accepts": [["${file.meta.width}", "<=", "2048"],["${file.meta.height}", "<=", "2048"]],
      "condition_type": "or"
    },
    "large_resized": {
      "use": ["large_filtered"],
      "robot": "/image/resize",
      "result": true,
      "height": 2048,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 2048
    },
    "smaller_resized": {
      "use": ["smaller_filtered"],
      "robot": "/image/resize",
      "result": true,
      "height": "${file.meta.height}",
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": "${file.meta.width}"
    },
    "optimized": {
      "use": ["smaller_resized", "large_resized"],
      "robot": "/image/optimize",
      "result": true
    },
    "exported": {
      "use": [":original", "large_filtered", "large_resized", "optimized", "smaller_filtered", "smaller_resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Import files from an FTP server

{
  "steps": {
    "imported": {
      "robot": "/ftp/import",
      "result": true,
      "credentials": "YOUR_CREDENTIALS",
      "path": "my_folder/desert.jpg"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["imported", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Import files over HTTP

{
  "steps": {
    "imported": {
      "robot": "/http/import",
      "url": "http://demos.transloadit.com/inputs/chameleon.jpg"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["imported", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Import a specific file from S3

{
  "steps": {
    "imported": {
      "robot": "/s3/import",
      "result": true,
      "credentials": "demo_s3_credentials",
      "path": "my_folder/desert.jpg"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["imported", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Import an entire folder of files from S3

{
  "steps": {
    "imported": {
      "robot": "/s3/import",
      "result": true,
      "credentials": "demo_s3_credentials",
      "path": "my_folder/"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["imported", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Import an entire folder of files from an SFTP Server

{
  "steps": {
    "imported": {
      "robot": "/sftp/import",
      "result": true,
      "credentials": "YOUR_CREDENTIALS",
      "path": "my_folder/"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["imported", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Resize all images in an S3 bucket

{
  "steps": {
    "imported": {
      "robot": "/s3/import",
      "result": true,
      "credentials": "demo_s3_credentials",
      "path": "my_folder/"
    },
    "resized": {
      "use": ["imported"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v2.0.3",
      "width": 130,
      "zoom": false
    },
    "exported": {
      "use": ["resized"],
      "robot": "/s3/store",
      "result": true,
      "credentials": "demo_s3_credentials",
      "path": "${file.original_path}-resized@130/${file.basename}.${file.ext}"
    }
  }
}

Specify multiple encoding Steps for a single file

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "ipad_encoded": {
      "use": [":original"],
      "robot": "/video/encode",
      "result": true,
      "ffmpeg_stack": "v2.2.3",
      "preset": "ipad-high"
    },
    "iphone_encoded": {
      "use": [":original"],
      "robot": "/video/encode",
      "result": true,
      "ffmpeg_stack": "v2.2.3",
      "preset": "iphone"
    },
    "thumbnailed": {
      "use": [":original"],
      "robot": "/video/thumbs",
      "result": true,
      "ffmpeg_stack": "v2.2.3"
    },
    "thumbs_resized": {
      "use": ["thumbnailed"],
      "robot": "/image/resize",
      "result": true,
      "height": 130,
      "imagemagick_stack": "v1.0.0",
      "width": 130
    },
    "exported": {
      "use": [":original", "ipad_encoded", "iphone_encoded", "thumbs_resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Automatically process multiple file types

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "image_thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "format": "png",
      "height": 240,
      "imagemagick_stack": "v1.0.0",
      "width": 320
    },
    "video_thumbed": {
      "use": [":original"],
      "robot": "/video/thumbs",
      "result": true,
      "background": "#000000",
      "count": 4,
      "ffmpeg_stack": "v2.2.3",
      "height": 240,
      "resize_strategy": "pad",
      "width": 320
    },
    "ipad_encoded": {
      "use": [":original"],
      "robot": "/video/encode",
      "result": true,
      "ffmpeg_stack": "v2.2.3",
      "preset": "ipad-high"
    },
    "exported": {
      "use": ["image_thumbed", "video_thumbed", "ipad_encoded", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Add a sepia effect to an image

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "resized": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 500,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 500,
      "zoom": false
    },
    "sepiad90": {
      "use": ["resized"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v1.0.0",
      "sepia": 90
    },
    "exported": {
      "use": ["resized", "sepiad90", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Resize and apply transparency, based on a clipping path inside an image

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "with_clip": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "accepts": [["${file.meta.has_clipping_path}", "=", "true"]]
    },
    "without_clip": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "accepts": [["${file.meta.has_clipping_path}", "=", "false"]]
    },
    "trans_with_clip": {
      "use": ["with_clip"],
      "robot": "/image/resize",
      "result": true,
      "alpha": "Transparent",
      "background": "transparent",
      "clip": true,
      "flatten": false,
      "format": "png",
      "imagemagick_stack": "v2.0.3",
      "preclip_alpha": "Opaque",
      "rotation": 0
    },
    "trans_without_clip": {
      "use": ["without_clip"],
      "robot": "/image/resize",
      "result": true,
      "background": "transparent",
      "flatten": false,
      "format": "png",
      "imagemagick_stack": "v2.0.3",
      "rotation": 0
    },
    "resized": {
      "use": ["trans_with_clip", "trans_without_clip"],
      "robot": "/image/resize",
      "result": true,
      "background": "transparent",
      "flatten": false,
      "height": 500,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "pad",
      "rotation": 0,
      "strip": true,
      "trim_whitespace": true,
      "width": 250
    },
    "exported": {
      "use": [":original", "trans_without_clip", "with_clip", "without_clip", "trans_with_clip", "resized"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Avoid zooming small images when resizing

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "background": "#000000",
      "height": 300,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "pad",
      "width": 300,
      "zoom": false
    },
    "exported": {
      "use": ["thumbed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Change the quality of a JPEG

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "resized": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 500,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 500,
      "zoom": false
    },
    "qualitied40": {
      "use": ["resized"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v1.0.0",
      "quality": 40
    },
    "qualitied92": {
      "use": ["resized"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v1.0.0",
      "quality": 90
    },
    "exported": {
      "use": ["resized", "qualitied40", "qualitied92", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Convert an image from JPG to PNG

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "format": "png",
      "imagemagick_stack": "v1.0.0"
    },
    "exported": {
      "use": ["thumbed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Convert an image to WebP

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "webp_converted": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "format": "webp",
      "imagemagick_stack": "v2.0.3"
    },
    "exported": {
      "use": ["webp_converted", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Crop an image based on cropping coordinates

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "crop_thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "crop": {"x1":30,"y1":30,"x2":120,"y2":90},
      "imagemagick_stack": "v1.0.0"
    },
    "exported": {
      "use": ["crop_thumbed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Crop a picture to 100×100 pixels

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "crop_thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 100,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fillcrop",
      "width": 100
    },
    "exported": {
      "use": ["crop_thumbed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Apply a watermark to images

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "watermarked": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "format": "jpg",
      "imagemagick_stack": "v1.0.0",
      "watermark_position": "bottom-right",
      "watermark_size": "25%",
      "watermark_url": "http://demos.transloadit.com/inputs/transloadit-padded.png"
    },
    "exported": {
      "use": ["watermarked", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Properly preserve transparency across image types

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "nontransparent_filtered": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "accepts": [["${file.mime}", "=", "image/jpeg"],["${file.mime}", "=", "image/jpg"]],
      "error_on_decline": false
    },
    "maybetransparent_filtered": {
      "use": [":original"],
      "robot": "/file/filter",
      "result": true,
      "declines": [["${file.mime}", "=", "image/jpeg"],["${file.mime}", "=", "image/jpg"]],
      "error_on_decline": false
    },
    "nontransparent_resized": {
      "use": ["nontransparent_filtered"],
      "robot": "/image/resize",
      "result": true,
      "height": 300,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 400
    },
    "maybetransparent_resized": {
      "use": ["maybetransparent_filtered"],
      "robot": "/image/resize",
      "result": true,
      "background": "none",
      "height": 300,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 400
    },
    "exported": {
      "use": ["nontransparent_filtered", "maybetransparent_filtered", "nontransparent_resized", "maybetransparent_resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Remove a color around the edges of an image

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "trimmed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v2.0.3",
      "trim_whitespace": true
    },
    "exported": {
      "use": ["trimmed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Resize an image to exactly 100×100 pixels

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "fitted": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 100,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fit",
      "width": 100
    },
    "min_fitted": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 100,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "min_fit",
      "width": 100
    },
    "stretched": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 100,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "stretch",
      "width": 100
    },
    "padded": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "background": "${file.meta.average_color}",
      "height": 100,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "pad",
      "width": 100
    },
    "cropped": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "crop": {"x1":150,"y1":100,"x2":250,"y2":200},
      "gravity": "center",
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "crop"
    },
    "fillcropped": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "gravity": "center",
      "height": 100,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fillcrop",
      "width": 100
    },
    "exported": {
      "use": ["fitted", "min_fitted", "stretched", "padded", "cropped", "fillcropped", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Resize an image to exactly 75×75 pixels

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "fitted": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 75
    },
    "min_fitted": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "min_fit",
      "width": 75
    },
    "stretched": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "stretch",
      "width": 75
    },
    "padded": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "background": "#aa0000",
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "pad",
      "width": 75
    },
    "cropped": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "gravity": "center",
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "crop",
      "width": 75
    },
    "fillcropped": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "gravity": "center",
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fillcrop",
      "width": 75
    },
    "exported": {
      "use": ["fitted", "min_fitted", "stretched", "padded", "cropped", "fillcropped", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Rotate uploaded images

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "thumbed": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v1.0.0",
      "rotation": 90
    },
    "exported": {
      "use": ["thumbed", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Apply a text watermark to images

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "resized": {
      "use": [":original"],
      "robot": "/image/resize",
      "result": true,
      "height": 500,
      "imagemagick_stack": "v1.0.0",
      "resize_strategy": "fit",
      "width": 500,
      "zoom": false
    },
    "watermarked": {
      "use": ["resized"],
      "robot": "/image/resize",
      "result": true,
      "imagemagick_stack": "v1.0.0",
      "text": [{"text":"© 2018 Transloadit.com", "size":12,"font":"Ubuntu", "color":"#eeeeee", "valign":"bottom", "align":"right", "x_offset":16,"y_offset":-10}]
    },
    "exported": {
      "use": ["resized", "watermarked", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Extract 10 thumbnails and modify their size

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "ipad_encoded": {
      "use": [":original"],
      "robot": "/video/encode",
      "ffmpeg_stack": "v2.2.3",
      "height": 480,
      "preset": "ipad-high",
      "width": 640
    },
    "thumbnailed": {
      "use": ["ipad_encoded"],
      "robot": "/video/thumbs",
      "count": 10,
      "ffmpeg_stack": "v2.2.3"
    },
    "large_resized": {
      "use": ["thumbnailed"],
      "robot": "/image/resize",
      "result": true,
      "height": 120,
      "imagemagick_stack": "v1.0.0",
      "width": 120
    },
    "medium_resized": {
      "use": ["thumbnailed"],
      "robot": "/image/resize",
      "result": true,
      "height": 75,
      "imagemagick_stack": "v1.0.0",
      "width": 75
    },
    "small_resized": {
      "use": ["thumbnailed"],
      "robot": "/image/resize",
      "result": true,
      "height": 30,
      "imagemagick_stack": "v1.0.0",
      "width": 30
    },
    "exported": {
      "use": ["ipad_encoded", "thumbnailed", "small_resized", "medium_resized", "large_resized", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Generate a video from an image sequence

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "imported_chameleon": {
      "robot": "/http/import",
      "result": true,
      "url": "http://demos.transloadit.com/inputs/chameleon.jpg"
    },
    "imported_prinsengracht": {
      "robot": "/http/import",
      "result": true,
      "url": "http://demos.transloadit.com/inputs/prinsengracht.jpg"
    },
    "imported_snowflake": {
      "robot": "/http/import",
      "result": true,
      "url": "http://demos.transloadit.com/inputs/desert.jpg"
    },
    "resized": {
      "use": ["imported_chameleon", "imported_prinsengracht", "imported_snowflake"],
      "robot": "/image/resize",
      "result": true,
      "height": 768,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fit",
      "width": 1024,
      "zoom": false
    },
    "merged": {
      "use": {"steps":[{"name":":original", "as":"audio"},{"name":"resized", "as":"image"}],"bundle_steps":true},
      "robot": "/video/merge",
      "result": true,
      "duration": 9,
      "ffmpeg_stack": "v3.3.3",
      "framerate": "1/3",
      "preset": "ipad-high",
      "resize_strategy": "fit"
    },
    "exported": {
      "use": ["imported_chameleon", "imported_prinsengracht", "imported_snowflake", "resized", "merged", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Merge an audio file and an image to generate a video

{
  "steps": {
    ":original": {
      "robot": "/upload/handle"
    },
    "imported_image": {
      "robot": "/http/import",
      "url": "http://demos.transloadit.com/inputs/chameleon.jpg"
    },
    "resized_image": {
      "use": ["imported_image"],
      "robot": "/image/resize",
      "result": true,
      "height": 768,
      "imagemagick_stack": "v2.0.3",
      "resize_strategy": "fit",
      "width": 1024,
      "zoom": false
    },
    "merged": {
      "use": {"steps":[{"name":":original", "as":"audio"},{"name":"resized_image", "as":"image"}]},
      "robot": "/video/merge",
      "result": true,
      "ffmpeg_stack": "v3.3.3",
      "preset": "ipad-high",
      "resize_strategy": "pad"
    },
    "exported": {
      "use": ["imported_image", "resized_image", "merged", ":original"],
      "robot": "/s3/store",
      "credentials": "demo_s3_credentials"
    }
  }
}

Blog posts about our /image/resize Robot

Over the years we wrote the following posts about our /image/resize Robot on our blog:

Did you know?

You can easily combine Robots to create powerful workflows, unique to your business.
This is the power of Transloadit.