Limiting an image by specified dimensions

Limit the size of the image by specifying the width and height (w and h in URLs) while setting the crop parameter to limit. This will create an image that does not exceed the given width and height. All original image parts remain visible and the aspect ratio of the original image is kept.

Here's an original image:

Ruby:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg")
PHP:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg")
Python:
Copy to clipboard
CloudinaryImage("cashew_chicken.jpg").image()
Node.js:
Copy to clipboard
cloudinary.image("cashew_chicken.jpg")
Java:
Copy to clipboard
cloudinary.url().imageTag("cashew_chicken.jpg");
JS:
Copy to clipboard
cloudinary.imageTag('cashew_chicken.jpg').toHtml();
jQuery:
Copy to clipboard
$.cloudinary.image("cashew_chicken.jpg")
React:
Copy to clipboard
<Image publicId="cashew_chicken.jpg" >

</Image>
Vue.js:
Copy to clipboard
<cld-image publicId="cashew_chicken.jpg" >

</cld-image>
Angular:
Copy to clipboard
<cl-image public-id="cashew_chicken.jpg" >

</cl-image>
.Net:
Copy to clipboard
cloudinary.Api.UrlImgUp.BuildImageTag("cashew_chicken.jpg")
Android:
Copy to clipboard
MediaManager.get().url().generate("cashew_chicken.jpg");
iOS:
Copy to clipboard
imageView.cldSetImage(cloudinary.createUrl().generate("cashew_chicken.jpg")!, cloudinary: cloudinary)
Original

Here's the same image, limited to 70x70 pixels:

Ruby:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg", :width=>70, :height=>70, :crop=>"limit")
PHP:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg", array("width"=>70, "height"=>70, "crop"=>"limit"))
Python:
Copy to clipboard
CloudinaryImage("cashew_chicken.jpg").image(width=70, height=70, crop="limit")
Node.js:
Copy to clipboard
cloudinary.image("cashew_chicken.jpg", {width: 70, height: 70, crop: "limit"})
Java:
Copy to clipboard
cloudinary.url().transformation(new Transformation().width(70).height(70).crop("limit")).imageTag("cashew_chicken.jpg");
JS:
Copy to clipboard
cloudinary.imageTag('cashew_chicken.jpg', {width: 70, height: 70, crop: "limit"}).toHtml();
jQuery:
Copy to clipboard
$.cloudinary.image("cashew_chicken.jpg", {width: 70, height: 70, crop: "limit"})
React:
Copy to clipboard
<Image publicId="cashew_chicken.jpg" >
  <Transformation width="70" height="70" crop="limit" />
</Image>
Vue.js:
Copy to clipboard
<cld-image publicId="cashew_chicken.jpg" >
  <cld-transformation width="70" height="70" crop="limit" />
</cld-image>
Angular:
Copy to clipboard
<cl-image public-id="cashew_chicken.jpg" >
  <cl-transformation width="70" height="70" crop="limit">
  </cl-transformation>
</cl-image>
.Net:
Copy to clipboard
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(70).Height(70).Crop("limit")).BuildImageTag("cashew_chicken.jpg")
Android:
Copy to clipboard
MediaManager.get().url().transformation(new Transformation().width(70).height(70).crop("limit")).generate("cashew_chicken.jpg");
iOS:
Copy to clipboard
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(70).setHeight(70).setCrop("limit")).generate("cashew_chicken.jpg")!, cloudinary: cloudinary)
70x70 Limited

Note that since the aspect ratio is kept, this transformation actually resulted a 70x47 pixels image.

When setting the width and height parameters to values that exceed the original image's dimensions, this will actually deliver the original image as is (850x565 px):

Ruby:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg", :width=>1000, :height=>1000, :crop=>"limit")
PHP:
Copy to clipboard
cl_image_tag("cashew_chicken.jpg", array("width"=>1000, "height"=>1000, "crop"=>"limit"))
Python:
Copy to clipboard
CloudinaryImage("cashew_chicken.jpg").image(width=1000, height=1000, crop="limit")
Node.js:
Copy to clipboard
cloudinary.image("cashew_chicken.jpg", {width: 1000, height: 1000, crop: "limit"})
Java:
Copy to clipboard
cloudinary.url().transformation(new Transformation().width(1000).height(1000).crop("limit")).imageTag("cashew_chicken.jpg");
JS:
Copy to clipboard
cloudinary.imageTag('cashew_chicken.jpg', {width: 1000, height: 1000, crop: "limit"}).toHtml();
jQuery:
Copy to clipboard
$.cloudinary.image("cashew_chicken.jpg", {width: 1000, height: 1000, crop: "limit"})
React:
Copy to clipboard
<Image publicId="cashew_chicken.jpg" >
  <Transformation width="1000" height="1000" crop="limit" />
</Image>
Vue.js:
Copy to clipboard
<cld-image publicId="cashew_chicken.jpg" >
  <cld-transformation width="1000" height="1000" crop="limit" />
</cld-image>
Angular:
Copy to clipboard
<cl-image public-id="cashew_chicken.jpg" >
  <cl-transformation width="1000" height="1000" crop="limit">
  </cl-transformation>
</cl-image>
.Net:
Copy to clipboard
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(1000).Height(1000).Crop("limit")).BuildImageTag("cashew_chicken.jpg")
Android:
Copy to clipboard
MediaManager.get().url().transformation(new Transformation().width(1000).height(1000).crop("limit")).generate("cashew_chicken.jpg");
iOS:
Copy to clipboard
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(1000).setHeight(1000).setCrop("limit")).generate("cashew_chicken.jpg")!, cloudinary: cloudinary)
1000x1000 Limited

by Itay Taragano