You can find the common resize operations below :
width to resize with a specific width,
height to resize with a specific height,
crop to crop the image at the center,
fit to resize the image in a box and keeping the proportions of the source image, and
cover to resize the image in a box without keeping the proportions of the source image.
Remember, the format of any Cloudimage URL is:
crop. For other operations, use a random placeholder like
In practise, it is supereasy to use:
|operation||Example 1||Example 2||Example 3|
|No resize, just CDN delivery
|Resize to width 100px
|Resize to height 100px
|crop centrally to 150x150px
see below for more doc
150x150px with #3498db background
fits in a 150x150px container without padding
Here is the summary of all operations with their respective impacts on the image's proportions.
|required dimensions||result image has same ratio as original||result image has no distortion||result image has all data||which part is kept?||padding is added|
|cdn||0||same ratio||no distortion||yes||all|
|width||1||same ratio||no distortion||yes||all|
|height||1||same ratio||no distortion||yes||all|
|crop||2||not same ratio||no distortion||no||center|
|crop_px||2||not same ratio||no distortion||no||configurable|
|fit||2||not same ratio||no distortion||yes||all||yes|
|bound||2||same ratio||no distortion||yes||all||no|
|cover||2||not same ratio||distortion||yes||all|
You can crop your images with 3 different operations: crop, fit. When you use the fit function, you can add a background to cover the white space in the resulting canvas, see examples below.
When you use the
fit operation, a background can appear if the resulting canvas has not the same proportion as the source image. You can specify in the options the background color with a color code such as
cFF99CC, or you can choose transparency with
ctrans. Without option, the default background is white.
Cloudimage's positionable crop feature allows you to define the crop zone and to not necessary use the center of the image as center of the crop zone. It is extremely useful when you want to crop a specific part of the image, like for example a face for a profile picture. The size parameter is composed of 2 parts :
The first part (
x1,y1,x2,y2) represent the rectangle to crop in the source image. The second part
final_size can be either
You'll understand better by looking at the example below :) :
If you need a transformation that is not listed here, feel free to contact us and we will be happy to add it (quickly) !