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:
cl_image_tag("cashew_chicken.jpg")
PHP:
cl_image_tag("cashew_chicken.jpg")
Python:
CloudinaryImage("cashew_chicken.jpg").image()
Node.js:
cloudinary.image("cashew_chicken.jpg")
Java:
cloudinary.url().imageTag("cashew_chicken.jpg")
JS:
cl.imageTag('cashew_chicken.jpg').toHtml();
jQuery:
$.cloudinary.image("cashew_chicken.jpg")
React:
<Image publicId="cashew_chicken.jpg" >

</Image>
Angular:
<cl-image public-id="cashew_chicken.jpg" >

</cl-image>
.Net:
cloudinary.Api.UrlImgUp.BuildImageTag("cashew_chicken.jpg")
Android:
MediaManager.get().url().generate("cashew_chicken.jpg")
Original

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

Ruby:
cl_image_tag("cashew_chicken.jpg", :width=>70, :height=>70, :crop=>"limit")
PHP:
cl_image_tag("cashew_chicken.jpg", array("width"=>70, "height"=>70, "crop"=>"limit"))
Python:
CloudinaryImage("cashew_chicken.jpg").image(width=70, height=70, crop="limit")
Node.js:
cloudinary.image("cashew_chicken.jpg", {width: 70, height: 70, crop: "limit"})
Java:
cloudinary.url().transformation(new Transformation().width(70).height(70).crop("limit")).imageTag("cashew_chicken.jpg")
JS:
cl.imageTag('cashew_chicken.jpg', {width: 70, height: 70, crop: "limit"}).toHtml();
jQuery:
$.cloudinary.image("cashew_chicken.jpg", {width: 70, height: 70, crop: "limit"})
React:
<Image publicId="cashew_chicken.jpg" >
  <Transformation width="70" height="70" crop="limit" />
</Image>
Angular:
<cl-image public-id="cashew_chicken.jpg" >
  <cl-transformation width="70" height="70" crop="limit">
  </cl-transformation>
</cl-image>
.Net:
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(70).Height(70).Crop("limit")).BuildImageTag("cashew_chicken.jpg")
Android:
MediaManager.get().url().transformation(new Transformation().width(70).height(70).crop("limit")).generate("cashew_chicken.jpg")
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:
cl_image_tag("cashew_chicken.jpg", :width=>1000, :height=>1000, :crop=>"limit")
PHP:
cl_image_tag("cashew_chicken.jpg", array("width"=>1000, "height"=>1000, "crop"=>"limit"))
Python:
CloudinaryImage("cashew_chicken.jpg").image(width=1000, height=1000, crop="limit")
Node.js:
cloudinary.image("cashew_chicken.jpg", {width: 1000, height: 1000, crop: "limit"})
Java:
cloudinary.url().transformation(new Transformation().width(1000).height(1000).crop("limit")).imageTag("cashew_chicken.jpg")
JS:
cl.imageTag('cashew_chicken.jpg', {width: 1000, height: 1000, crop: "limit"}).toHtml();
jQuery:
$.cloudinary.image("cashew_chicken.jpg", {width: 1000, height: 1000, crop: "limit"})
React:
<Image publicId="cashew_chicken.jpg" >
  <Transformation width="1000" height="1000" crop="limit" />
</Image>
Angular:
<cl-image public-id="cashew_chicken.jpg" >
  <cl-transformation width="1000" height="1000" crop="limit">
  </cl-transformation>
</cl-image>
.Net:
cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(1000).Height(1000).Crop("limit")).BuildImageTag("cashew_chicken.jpg")
Android:
MediaManager.get().url().transformation(new Transformation().width(1000).height(1000).crop("limit")).generate("cashew_chicken.jpg")
1000x1000 Limited

by Itay Taragano