Overview
Sources
Libraries
Images API

Resize Mode mode

Specify the mode that will be applied to change the size of the output image.

Values

Accepted values for this parameter are clip, crop, contain, face and force, with clip as default value.

Clip

Clip is the default resize mode. This mode will resize the image to fit the specified width and height parameters, clipping and maintaining original aspect-ratio.

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600
Woman posing image resized using default clip mode with width and height parameters.
x px

Crop

Crop mode will resize the image and remove the outer areas that does not fit within the values specified by width and height parameters. Both width and height parameters must be set in order to work.

crop parameter is used to specify how the crop will be performed.

In this example we are specifying a cropping of 600x600 pixels with width=600, height=600 and mode=crop:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600&mode=crop
Woman posing image resized using crop mode with width and height parameters.
x px

For this example we are using the same parameters than the previous request but adding crop=left, moving the center of the cropping to the left side:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600&mode=crop&crop=left
Woman posing image resized using crop mode, moving the center of the crop to the left with crop parameter.
x px

There are several crop modes available. Please take a look to the crop parameter to see some examples on how to use them.

Contain

The image will be resized maintaining it's aspect-ratio while fitting the image inside the specified size. The image will be letterboxed if it's aspect ratio does not match the one specified by width and height parameters.

contain parameter is used to specify how the letterboxed areas will be filled with color value as default.

In this example we are specifying a width of 1200 pixels with width=1200, a height of 600 pixels with height=600, resize mode to be contain with mode=contain.

By default contain mode will be color so a white default background color will be used to fill the letterboxed areas:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=1200&height=600&mode=contain
Woman posing image resized with contain mode showing a white letterboxed background area.
x px

In the following example we are using the same parameters than the previous but adding a different contain mode that is set to blur with contain=blur:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=1200&height=600&mode=contain&contain=blur
Woman posing image resized with contain mode, showing a blurred letterboxed background area using contain parameter with blur value.
x px

If necessary you can disable upscale with upscale=false to avoid resize the base image beyond it's original size. In the following example we are using a smaller version of our image to show the difference:

GET
https://assets.imglab-cdn.net/woman-03-small.jpeg?width=1200&height=600&mode=contain&contain=blur&upscale=false
Woman posing image resized with contain mode, showing a blurred letterboxed background and not upscaling with disabled upscale parameter.
x px

There are several contain modes available. Please take a look to the contain parameter to see some examples on how to use them.

Face

The image will be resized according to the values specified by width and height parameters trying to fit the face or faces detected in the image.

In this example we are specifying a width and height of 600 pixels with width=600 and heigth=600 and using mode=face:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600&mode=face
Woman posing image focus on woman's face using face resizing mode.
x px

It's possible to specify a different face-padding. In this example we are setting a face-padding of 2.3 with face-padding=2.3:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600&mode=face&face-padding=2.3
Woman posing image focus on woman's face using face resizing mode but specifying some face padding with face-padding parameter.
x px

If more than one face is detected the image will be resized to fit all the faces according to the values specified on width and height parameters:

GET
https://assets.imglab-cdn.net/couple.jpeg?width=600&height=600&mode=face&face-padding=2.3
A couple taking a selfie and focus in the two faces with face mode.
x px

Force

Will resize the image to the specified width and height values without maintaining original image aspect-ratio.

In this example we are forcing the image to have a size of 600x600 pixels with parameters width=600, height=600 and mode=force:

GET
https://assets.imglab-cdn.net/woman-03.jpeg?width=600&height=600&mode=force
Woman posing image stretched to a specific width and height using resizing force mode.
x px