Increase Background Dimensions

Patrick Hyde

September 01, 2022 15:27

Hi, our e-commerce business previously used 7.5:10 horizontal dimensions for product photos. With our new CMS, we want to transform these images to 1:1 square dimensions, but using the 1:1 crop tool cuts off some of the product images so that the top or bottom are not included because of the smaller width. 

Is there a way to increase the dimensions of the image (all white background with centered product) so that we can transform inside Cloudinary? For example, turn an image with dimensions of 750x1000 into 1000x1000 while keep the product size the same, just increasing the white background? I can do this in Photoshop, but would rather not use two programs for such a simple transformation. Thanks! 

1

• 

  Tia Esguerra

  September 01, 2022 20:13

  Hi Patrick, 

  Thanks for reaching out. 

  Yes, you can do this by using the c_pad transformation. What this does is resize the image to the dimensions you specify, keeping all parts of that image visible ( nothing is cropped out ). If the aspect ratio of the original image is not the same as the aspect ratio of the dimensions you specified, padding will be added. The padding will be white by default. 

  You can see the original sample image here, where the aspect ratio is 3:2
  https://res.cloudinary.com/demo/image/upload/sample.jpg
  
  And you can see here that I have asked for the image to be a square -  1:1 aspect ratio, by including the c_pad transformation
  https://res.cloudinary.com/demo/image/upload/c_pad,h_300,w_300/sample.jpg 
  
  You can reference our documentation on the c_pad transformation here: https://cloudinary.com/documentation/transformation_reference#c_pad 
  
  I hope this helps. Let me know if you have any questions. 
  
  Kind Regards, 

  Tia

  0
• 

  Patrick Hyde

  September 01, 2022 20:39

  Hi Tia,

  Thank you, this worked for me! 

  0
• 

  Kate Breish

  October 11, 2022 15:21

  @Tia Esguerra Hi!  Our company is running into the same issue, but we are working with images that do not have pure white backgrounds.  Is it possible for a content-aware fill to be added when increasing the background of an image to make it 1:1?  Also is it possible for a code to be written so that, in automating this process when downloading, that it could ignore files with "DE" in them and instead crop into those?  We are not equipped to write this coding ourselves, would your coders be able to create something custom for us?

  Thanks in advance!

  Kate

  0

Post is closed for comments.