Padding can be done pretty easily with Cloudinary. Padding can be applied on either the width, the height, or both.
The following examples are added with borders to better demonstrate the difference:
Here's the original image:
You can use the
pad crop mode when resizing-down your image while setting the required width and height. The aspect ratio of the image is kept, so if the width and height do not match the aspect ratio, the padding is added:
You can use the
lpad (limited pad) crop mode which is the same as 'pad' mode but doesn't scale the image up if your requested dimensions are larger than the original image's:
Note that when specifying either the
height parameter or the
width parameter (not both), Cloudinary calculates the padding by the image's original aspect ratio, which might cause padding for both width an height:
In order to add padding to the width only, you can either manually specify the required height:
Or set the required width only while adding the
ignore_aspect_ratio flag (
fl_ignore_aspect_ratio in URLs):
Note that when using padding (both
lpad) with dimensions lower than the original, the image will be scaled-down:
In order to avoid scaling down the image, you can use the
mpad crop mode, which is the same as the
pad mode but doesn't scale the original image:
Focus and pad? I have a customer with 10's of thousands of pictures of shoes. All their newer stuff is nicely centered, but their older images are often pushed to the bottom. Could one use one of the fancy built in or add-on focusing tools to center on the shoe and pad it (all shoes are conveniently on white!) ?
A possible solution is to first crop the image and then add the required padding. Cropping the image can be either done by using the
trimparameter as explained here.
Another option is to use our Imagga add-on to do the cropping and then add the required padding.
If this doesn't work for you, can you please share an example image (pushed to the bottom) and the required result, so we'll be able to offer a solution?
If privacy is an issue, you can always open a ticket and share your images there.
Can you set the pad color? My application is email, the customer has lots of photos, I currently resize limit to make them the correct size, but padding definitely provides some layout advantages. The customer defines the layout of the email and sometimes the background color isn't white.
You can set the
bin URLs), which works for both color names:
or RGB code:
Alternatively, you can have transparent padding simply by delivering the image as PNG:
Please sign in to leave a comment.