{"id":21227,"date":"2014-04-25T11:12:29","date_gmt":"2014-04-25T11:12:29","guid":{"rendered":"http:\/\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary"},"modified":"2024-08-15T14:01:03","modified_gmt":"2024-08-15T21:01:03","slug":"beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","title":{"rendered":"Beyond face detection &#8211; smart cropping in the cloud using Imagga and Cloudinary"},"content":{"rendered":"<div class=\"wp-block-cloudinary-markdown \"><p>It\u2019s a common challenge in many mobile and web applications: how do you allow users to upload their own images, while automatically adapting these images to a fixed graphic design?<\/p>\n<h2>Cropping images at scale<\/h2>\n<p>A classic example is a user uploading a profile picture, but instead of providing a headshot, they upload a picture of their entire body with additional objects in the background. This image will need to be cropped to the size of the profile picture, while focusing on the user\u2019s face.<\/p>\n<p>One way to achieve this is to allow the user to crop the image themselves as part of the upload process. But even so, there is usually a need to use the image in several different contexts, in different sizes and positions, and the user\u2019s cropping can\u2019t help us produce all these different versions.<\/p>\n<p>A more advanced approach is <strong>face detection<\/strong> &#8211; there are new software tools and APIs that can recognize the face in the image, and crop the image automatically, focusing on the human face. Actually, <a href=\"https:\/\/cloudinary.com\/blog\/face_detection_based_cropping\">face-detection based cropping<\/a> is one of the more popular features of Cloudinary\u2019s cloud-based image management solution and API.<\/p>\n<h2>Cloudinary + Imagga integration<\/h2>\n<p>But now we\u2019d like to take \u00a0it one step forward: What if you want to <strong>automatically crop thousands of images, focusing on an object that is not a human face?<\/strong> For example, eCommerce products, food, animals, or anything else that is more difficult to detect algorithmically.<\/p>\n<p>Take these three images of food plates &#8211; many images like these are uploaded by users of food sites, such as Cloudinary customers <a href=\"http:\/\/yummi.co.il\/\">Yummi<\/a>, <a href=\"http:\/\/www.cibando.com\/\">Cibando<\/a> and <a href=\"http:\/\/www.eatwith.com\/\">EatWith<\/a>:<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200\/cashew_chicken.jpg\" alt=\"Cashew chicken original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"133\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/h_150\/vegetable_soup.jpg\" alt=\"Vegetable soup original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"120\" height=\"150\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200\/pasta.jpg\" alt=\"Pasta original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"134\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>The website needs to automatically generate large, small and thumbnail versions of these photos, smartly cropped to show the main portion of the food plates. There\u2019s definitely a need for smart cropping based on the most appealing part of a photo, no matter what kind of photo it is. This is an even bigger technical challenge than cropping based on face detection.<\/p>\n<p>And that\u2019s exactly what <strong><a href=\"http:\/\/imagga.com\/technology\/smart-cropping-and-slicing.html\">Imagga<\/a><\/strong> have done with their smart cropping technology &#8211; they built a system that can detect the most appealing part of any image and focus on it automatically. We have integrated Imagga into Cloudinary\u2019s image management solution, and you can try it out as part of our free tier.<\/p>\n<p>Read on to see how Cloudinary makes it possible to automatically crop complex images to focus on the most appealing part of the photo, and automatically generate beautiful thumbnails, with just one line of code.<\/p>\n<h2>Photo scaling and smart thumbnail generation<\/h2>\n<p>Let\u2019s continue the example of the food site which uses Cloudinary and Imagga to automatically generate thumbnails of plates of food. The site\u2019s graphic design requires thumbnails of 200&#215;90. Again, here are the demo images we showed above:<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200\/cashew_chicken.jpg\" alt=\"Cashew chicken original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"133\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/h_150\/vegetable_soup.jpg\" alt=\"Vegetable soup original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"120\" height=\"150\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200\/pasta.jpg\" alt=\"Pasta original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"134\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>Cloudinary has a crop mode called <code>fill<\/code>, which allows you to crop an image to certain dimensions, while automatically filling the space with the result of the crop. You can specify a <code>gravity<\/code> which tells Cloudinary in which direction the focus of the crop should be.<\/p>\n<p>Here is a dynamic URL and code which crops one of the images above using <code>fill<\/code> mode, and sets gravity to <code>north<\/code>:<\/p>\n<p><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/pasta.jpg\" title=\"with_image: false\"><\/a><\/p>\n<p>The code above generates a dynamic URL, and when users access this URL, the image is transformed and delivered on the fly. You can create this URL directly, or use Cloudinary\u2019s client libraries to do the same thing with one line of code, in all popular languages and frameworks including PHP, Ruby on Rails and Node.js. Click on the tabs in the code samples in this article to view the code in your language or framework of choice.<\/p>\n<p>The results are:<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/cashew_chicken.jpg\" alt=\"Cashew chicken north gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/vegetable_soup.jpg\" alt=\"Vegetable soup north gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_north\/pasta.jpg\" alt=\"Pasta north gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>As you can see the results are still far from optimal. Especially the photo of the soup does not show the soup plate at all\u2026 We can try the <code>center<\/code> gravity as well. This time, the results are better, but still not good enough.<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/cashew_chicken.jpg\" alt=\"Cashew chicken center gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/vegetable_soup.jpg\" alt=\"Vegetable soup center gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_center\/pasta.jpg\" alt=\"Pasta center gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>The photos below were generated using the <code>south<\/code> gravity. Again, this is not good enough for a professional food site.<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/cashew_chicken.jpg\" alt=\"Cashew chicken south gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/vegetable_soup.jpg\" alt=\"Vegetable soup south gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_200,h_90,c_fill,g_south\/pasta.jpg\" alt=\"Pasta south gravity\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>Thankfully, we have the Imagga Add-on. By setting the <code>crop<\/code> parameter in the URL to <code>imagga_scale<\/code> and specifying dimensions of 200&#215;90, better-looking thumbnails are dynamically generated:<\/p>\n<p><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--MwkAA0qt--\/c_imagga_scale,h_90,w_200\/pasta.jpg\" title=\"with_image: false\">Imagga cropped image URL<\/a><\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--uG1N0zNm--\/c_imagga_scale,h_90,w_200\/cashew_chicken.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--uG1N0zNm--\/c_imagga_scale,h_90,w_200\/cashew_chicken.jpg\" alt=\"Cashew chicken cropped with Imagga\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--1tqj8wph--\/c_imagga_scale,h_90,w_200\/vegetable_soup.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--1tqj8wph--\/c_imagga_scale,h_90,w_200\/vegetable_soup.jpg\" alt=\"Vegetable soup cropped with Imagga\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a>\n<a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--MwkAA0qt--\/c_imagga_scale,h_90,w_200\/pasta.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--MwkAA0qt--\/c_imagga_scale,h_90,w_200\/pasta.jpg\" alt=\"Pasta cropped with Imagga\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"200\" height=\"90\"\/><\/a><\/p>\n<div style=\"display: block; clear: both; content: ''; margin-bottom: 15px\"><\/div>\n<p>The images above, generated by Imagga\u2019s smart cropping technology, are automatically focused on the most important part of the original image.<\/p>\n<p><strong>Note:<\/strong> In the URL we showed above, which resulted in the Imagga transformation, there was a special signature before the image transformation parameters &#8211; <code>\/``s--MwkAA0qt--``\/<\/code>. This code is required by Cloudinary to activate the Imagga add on. To see how to add it to the URL, see the <a href=\"https:\/\/cloudinary.com\/documentation\/imagga_crop_and_scale_addon\">documentation<\/a>. You can also use Imagga in Cloudinary without this signature by performing <a href=\"https:\/\/cloudinary.com\/documentation\/imagga_crop_and_scale_addon#eager_transformations\">Eager Transformations<\/a>.<\/p>\n<h2>Smart cropping &#8211; focusing on what\u2019s interesting in user images<\/h2>\n<p>User-uploaded photos often have a main object which is the most relevant, and a background which is less interesting and in many cases should not be shown on the site. For example, in the following photo the main object is the kitten, and there is a green grass surrounding the kitten.<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;kitten.jpg\\&quot; &gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;kitten.jpg\\&quot; &gt;\\n\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;kitten.jpg\\&quot; &gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;kitten.jpg\\&quot; &gt;\\n\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;kitten.jpg\\&quot; &gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;kitten.jpg\\&quot; &gt;\\n\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;kitten.jpg&#039;).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;kitten.jpg&#039;).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;kitten.jpg\\&quot;).image()&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;kitten.jpg\\&quot;).image()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;kitten.jpg&#039;));&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;kitten.jpg&#039;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().imageTag(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().imageTag(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.BuildImageTag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.BuildImageTag(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;kitten.jpg&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;kitten.jpg&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().generate(\\&quot;kitten.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().generate(\\&quot;kitten.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().generate(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().generate(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;kitten.jpg&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;kitten.jpg&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;kitten.jpg\\&quot;) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;kitten.jpg\\&quot;) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;kitten.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;kitten.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/kitten.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[],&quot;transformation_string&quot;:&quot;&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;kitten.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/kitten.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_300\/kitten.jpg\" alt=\"Uploaded kitten photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"300\" height=\"200\"\/><\/a><\/p>\n<p>While the photo with the green background is very nice, when displaying the highlights of a photo album or a certain news feed, you might wish to emphasize the kitten itself.<\/p>\n<p>By setting the <code>crop<\/code> parameter in the URL to <code>imagga_crop<\/code> without specifying width or height, the Imagga add-on smartly crops the image to keep the relevant part visible, while removing less relevant elements.<\/p>\n<p>The following URL and sample code can be used to embed an HTML image tag with this photo automatically cropped by Imagga:<\/p>\n<p>![Smartly cropped kitten photo](<a href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--1tQspuaM--\/c_imagga_crop\/kitten.jpg\">https:\/\/res.cloudinary.com\/demo\/image\/upload\/s&#8211;1tQspuaM&#8211;\/c_imagga_crop\/kitten.jpg<\/a> \u201cthumb: <a href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--cJcagalH--\/c_imagga_crop\/c_scale,w_200\/kitten.jpg\">https:\/\/res.cloudinary.com\/demo\/image\/upload\/s&#8211;cJcagalH&#8211;\/c_imagga_crop\/c_scale,w_200\/kitten.jpg<\/a>)<\/p>\n<p>While the original image is 850&#215;565, the cropped version is 462&#215;441. In the image above we also scaled it down to a width of 200 pixels to better fit in this post.<\/p>\n<p>Another example, this time of a fat cat. We have the same issue in this photo: a blurred green background surrounding the cat.<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image()&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;));&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().generate(\\&quot;fat_cat.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().generate(\\&quot;fat_cat.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/fat_cat.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[],&quot;transformation_string&quot;:&quot;&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;fat_cat.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/fat_cat.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/w_300\/fat_cat.jpg\" alt=\"Uploaded fat cat photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"300\" height=\"200\"\/><\/a><\/p>\n<p>Adding <code>c_imagga_crop<\/code> to the URL automatically crops the photo to focus on the cat, using the Imagga Add-on.<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {crop: \\&quot;imagga_crop\\&quot;, sign_url: true})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {crop: \\&quot;imagga_crop\\&quot;, sign_url: true})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt; &lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt;\\n\\t&lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {crop: \\&quot;imagga_crop\\&quot;, signUrl: true}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {crop: \\&quot;imagga_crop\\&quot;, signUrl: true}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(crop=\\&quot;imagga_crop\\&quot;, sign_url=True)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(crop=\\&quot;imagga_crop\\&quot;, sign_url=True)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;sign();&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;sign();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;, \\&quot;sign_url\\&quot;=&gt;true))&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;, \\&quot;sign_url\\&quot;=&gt;true))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, crop: \\&quot;imagga_crop\\&quot;, sign_url: true)&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, crop: \\&quot;imagga_crop\\&quot;, sign_url: true)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation().Crop(\\&quot;imagga_crop\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation().Crop(\\&quot;imagga_crop\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.setSignature(\\&quot;MR9UyfCL\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.setSignature(\\&quot;MR9UyfCL\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setCrop(\\&quot;imagga_crop\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setCrop(\\&quot;imagga_crop\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.setSignature(\\&quot;MR9UyfCL\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.setSignature(\\&quot;MR9UyfCL\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t signature() \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t signature() \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {crop: \\&quot;imagga_crop\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {crop: \\&quot;imagga_crop\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .setSignature(\\&quot;MR9UyfCL\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/s--MR9UyfCL--\\\/c_imagga_crop\\\/fat_cat.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[{&quot;crop_mode&quot;:&quot;imagga_crop&quot;}],&quot;transformation_string&quot;:&quot;c_imagga_crop&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;fat_cat.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;MR9UyfCL&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--MR9UyfCL--\/c_imagga_crop\/fat_cat.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--MR9UyfCL--\/c_imagga_crop\/fat_cat.jpg\" alt=\"Smartly cropped fat cat photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"347\" height=\"381\"\/><\/a><\/p>\n<h2>It\u2019s cropped &#8211; now what?<\/h2>\n<p>Of course, smart cropping is usually not the end of the story, there are usually additional transformations you\u2019ll need to perform to exactly fit the look and feel of the site.<\/p>\n<p>So &#8211; while we\u2019re at it, let\u2019s take the same code we used above to tell Cloudinary to smartly crop the photo, and modify it slightly to perform even more effects. Here\u2019s a simple example: let\u2019s say our graphic design requires the cat be resized to 200&#215;200 pixels, with white space padding and a border around it.<\/p>\n<p>We can do this simply by using the <code>pad<\/code> crop mode:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {sign_url: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {sign_url: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt; &lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;Transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot; \\\/&gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt;\\n\\t&lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n\\t&lt;Transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot; \\\/&gt;\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;cld-transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot; \\\/&gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot; \\\/&gt;\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation border=\\&quot;1px_solid_rgb:aaa\\&quot; height=\\&quot;200\\&quot; width=\\&quot;200\\&quot; crop=\\&quot;pad\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {signUrl: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {signUrl: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(sign_url=True, transformation=[ {&#039;crop&#039;: \\&quot;imagga_crop\\&quot;}, {&#039;border&#039;: \\&quot;1px_solid_rgb:aaa\\&quot;, &#039;height&#039;: 200, &#039;width&#039;: 200, &#039;crop&#039;: \\&quot;pad\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(sign_url=True, transformation=[\\n  {&#039;crop&#039;: \\&quot;imagga_crop\\&quot;},\\n  {&#039;border&#039;: \\&quot;1px_solid_rgb:aaa\\&quot;, &#039;height&#039;: 200, &#039;width&#039;: 200, &#039;crop&#039;: \\&quot;pad\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;resize(Resize::pad()-&gt;width(200)\\n-&gt;height(200))\\n\\t-&gt;border(Border::solid(1,Color::rgb(\\&quot;aaa\\&quot;)))\\n\\t-&gt;sign();&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;resize(Resize::pad()-&gt;width(200)\\n-&gt;height(200))\\n\\t-&gt;border(Border::solid(1,Color::rgb(\\&quot;aaa\\&quot;)))\\n\\t-&gt;sign();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;sign_url\\&quot;=&gt;true, \\&quot;transformation\\&quot;=&gt;array( array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;), array(\\&quot;border\\&quot;=&gt;\\&quot;1px_solid_rgb:aaa\\&quot;, \\&quot;height\\&quot;=&gt;200, \\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;pad\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;sign_url\\&quot;=&gt;true, \\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;),\\n  array(\\&quot;border\\&quot;=&gt;\\&quot;1px_solid_rgb:aaa\\&quot;, \\&quot;height\\&quot;=&gt;200, \\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;pad\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;).chain() .border(\\&quot;1px_solid_rgb:aaa\\&quot;).height(200).width(200).crop(\\&quot;pad\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .crop(\\&quot;imagga_crop\\&quot;).chain()\\n  .border(\\&quot;1px_solid_rgb:aaa\\&quot;).height(200).width(200).crop(\\&quot;pad\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, sign_url: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, sign_url: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation().Crop(\\&quot;imagga_crop\\&quot;).Chain() .Border(\\&quot;1px_solid_rgb:aaa\\&quot;).Height(200).Width(200).Crop(\\&quot;pad\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation()\\n  .Crop(\\&quot;imagga_crop\\&quot;).Chain()\\n  .Border(\\&quot;1px_solid_rgb:aaa\\&quot;).Height(200).Width(200).Crop(\\&quot;pad\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.pad().width(200)\\n.height(200))\\n\\t.border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t.setSignature(\\&quot;XzUAIh3B\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.pad().width(200)\\n.height(200))\\n\\t.border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t.setSignature(\\&quot;XzUAIh3B\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setCrop(\\&quot;imagga_crop\\&quot;).chain() .setBorder(\\&quot;1px_solid_rgb:aaa\\&quot;).setHeight(200).setWidth(200).setCrop(\\&quot;pad\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\\n  .setCrop(\\&quot;imagga_crop\\&quot;).chain()\\n  .setBorder(\\&quot;1px_solid_rgb:aaa\\&quot;).setHeight(200).setWidth(200).setCrop(\\&quot;pad\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;).chain() .border(\\&quot;1px_solid_rgb:aaa\\&quot;).height(200).width(200).crop(\\&quot;pad\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .crop(\\&quot;imagga_crop\\&quot;).chain()\\n  .border(\\&quot;1px_solid_rgb:aaa\\&quot;).height(200).width(200).crop(\\&quot;pad\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.pad().width(200)\\n.height(200))\\n\\t.border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t.setSignature(\\&quot;XzUAIh3B\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.pad().width(200)\\n.height(200))\\n\\t.border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t.setSignature(\\&quot;XzUAIh3B\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t resize(Resize.pad() { width(200)\\n height(200) })\\n\\t border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t signature() \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t resize(Resize.pad() { width(200)\\n height(200) })\\n\\t border(Border.solid(1,Color.rgb(\\&quot;aaa\\&quot;)))\\n\\t signature() \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {border: \\&quot;1px_solid_rgb:aaa\\&quot;, height: 200, width: 200, crop: \\&quot;pad\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(pad().width(200).height(200))\\n  .border(solid(1, \\&quot;#aaa\\&quot;))\\n  .setSignature(\\&quot;XzUAIh3B\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/s--XzUAIh3B--\\\/c_imagga_crop\\\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200\\\/fat_cat.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[{&quot;crop_mode&quot;:&quot;imagga_crop&quot;},{&quot;border&quot;:&quot;1px_solid_rgb:aaa&quot;,&quot;crop_mode&quot;:&quot;pad&quot;,&quot;height&quot;:&quot;200&quot;,&quot;width&quot;:&quot;200&quot;}],&quot;transformation_string&quot;:&quot;c_imagga_crop\\\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;fat_cat.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;XzUAIh3B&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--XzUAIh3B--\/c_imagga_crop\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200\/fat_cat.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--XzUAIh3B--\/c_imagga_crop\/bo_1px_solid_rgb:aaa,c_pad,h_200,w_200\/fat_cat.jpg\" alt=\"Padding to 200x200 of the smartly cropped photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"202\" height=\"202\"\/><\/a><\/p>\n<p>Here\u2019s the same code with a few more parameters tacked on that make the image circular, add a green border, increase color saturation, apply a sharpen effect, and add a logo watermark, while modifying its brightness and size. All these image transformations are done on the fly by Cloudinary when a user first accesses the image.<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {sign_url: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {sign_url: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt; &lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;Transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;Transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;sharpen\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; signUrl=\\&quot;true\\&quot;&gt;\\n\\t&lt;Transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n\\t&lt;Transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;Transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;sharpen\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt; &lt;cld-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;cld-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;sharpen\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; :overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cld-transformation crop=\\&quot;imagga_crop\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;sharpen\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; :overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt; &lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;saturation:100\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;sharpen\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; sign-url=\\&quot;true\\&quot;&gt;\\n\\t&lt;cl-transformation crop=\\&quot;imagga_crop\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;saturation:100\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;sharpen\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {signUrl: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {signUrl: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(sign_url=True, transformation=[ {&#039;crop&#039;: \\&quot;imagga_crop\\&quot;}, {&#039;width&#039;: 200, &#039;crop&#039;: \\&quot;scale\\&quot;}, {&#039;border&#039;: \\&quot;5px_solid_rgb:19340b\\&quot;, &#039;radius&#039;: \\&quot;max\\&quot;}, {&#039;effect&#039;: \\&quot;saturation:100\\&quot;}, {&#039;effect&#039;: \\&quot;sharpen\\&quot;}, {&#039;effect&#039;: \\&quot;brightness:-90\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;opacity&#039;: 25, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;crop&#039;: \\&quot;scale\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(sign_url=True, transformation=[\\n  {&#039;crop&#039;: \\&quot;imagga_crop\\&quot;},\\n  {&#039;width&#039;: 200, &#039;crop&#039;: \\&quot;scale\\&quot;},\\n  {&#039;border&#039;: \\&quot;5px_solid_rgb:19340b\\&quot;, &#039;radius&#039;: \\&quot;max\\&quot;},\\n  {&#039;effect&#039;: \\&quot;saturation:100\\&quot;},\\n  {&#039;effect&#039;: \\&quot;sharpen\\&quot;},\\n  {&#039;effect&#039;: \\&quot;brightness:-90\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;opacity&#039;: 25, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;crop&#039;: \\&quot;scale\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;resize(Resize::scale()-&gt;width(200))\\n\\t-&gt;border(Border::solid(5,Color::rgb(\\&quot;19340b\\&quot;))\\n\\t-&gt;roundCorners(\\n\\tRoundCorners::max())\\n\\t)\\n\\t-&gt;adjust(Adjust::saturation()-&gt;level(100))\\n\\t-&gt;adjust(Adjust::sharpen())\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(25))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(-90)))\\n\\t))\\n\\t-&gt;sign();&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::imaggaCrop())\\n\\t-&gt;resize(Resize::scale()-&gt;width(200))\\n\\t-&gt;border(Border::solid(5,Color::rgb(\\&quot;19340b\\&quot;))\\n\\t-&gt;roundCorners(\\n\\tRoundCorners::max())\\n\\t)\\n\\t-&gt;adjust(Adjust::saturation()-&gt;level(100))\\n\\t-&gt;adjust(Adjust::sharpen())\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(25))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(-90)))\\n\\t))\\n\\t-&gt;sign();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;sign_url\\&quot;=&gt;true, \\&quot;transformation\\&quot;=&gt;array( array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;), array(\\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;), array(\\&quot;border\\&quot;=&gt;\\&quot;5px_solid_rgb:19340b\\&quot;, \\&quot;radius\\&quot;=&gt;\\&quot;max\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;saturation:100\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;sharpen\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;brightness:-90\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;opacity\\&quot;=&gt;25, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;sign_url\\&quot;=&gt;true, \\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;crop\\&quot;=&gt;\\&quot;imagga_crop\\&quot;),\\n  array(\\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;),\\n  array(\\&quot;border\\&quot;=&gt;\\&quot;5px_solid_rgb:19340b\\&quot;, \\&quot;radius\\&quot;=&gt;\\&quot;max\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;saturation:100\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;sharpen\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;brightness:-90\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;opacity\\&quot;=&gt;25, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;).chain() .width(200).crop(\\&quot;scale\\&quot;).chain() .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain() .effect(\\&quot;saturation:100\\&quot;).chain() .effect(\\&quot;sharpen\\&quot;).chain() .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .crop(\\&quot;imagga_crop\\&quot;).chain()\\n  .width(200).crop(\\&quot;scale\\&quot;).chain()\\n  .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain()\\n  .effect(\\&quot;saturation:100\\&quot;).chain()\\n  .effect(\\&quot;sharpen\\&quot;).chain()\\n  .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).signed(true).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, sign_url: true, transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: 0.4, crop: \\&quot;scale\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, sign_url: true, transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: 0.4, crop: \\&quot;scale\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation().Crop(\\&quot;imagga_crop\\&quot;).Chain() .Width(200).Crop(\\&quot;scale\\&quot;).Chain() .Border(\\&quot;5px_solid_rgb:19340b\\&quot;).Radius(\\&quot;max\\&quot;).Chain() .Effect(\\&quot;saturation:100\\&quot;).Chain() .Effect(\\&quot;sharpen\\&quot;).Chain() .Effect(\\&quot;brightness:-90\\&quot;).Flags(\\&quot;relative\\&quot;).Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Opacity(25).Width(0.4).Crop(\\&quot;scale\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation()\\n  .Crop(\\&quot;imagga_crop\\&quot;).Chain()\\n  .Width(200).Crop(\\&quot;scale\\&quot;).Chain()\\n  .Border(\\&quot;5px_solid_rgb:19340b\\&quot;).Radius(\\&quot;max\\&quot;).Chain()\\n  .Effect(\\&quot;saturation:100\\&quot;).Chain()\\n  .Effect(\\&quot;sharpen\\&quot;).Chain()\\n  .Effect(\\&quot;brightness:-90\\&quot;).Flags(\\&quot;relative\\&quot;).Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Opacity(25).Width(0.4).Crop(\\&quot;scale\\&quot;)).Signed(true).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.scale().width(200))\\n\\t.border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;))\\n\\t.roundCorners(\\n\\tRoundCorners.max())\\n\\t)\\n\\t.adjust(Adjust.saturation().level(100))\\n\\t.adjust(Adjust.sharpen())\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(25))\\n\\t.adjust(Adjust.brightness().level(-90)))\\n\\t))\\n\\t.setSignature(\\&quot;e5VvY7Wl\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.imaggaCrop())\\n\\t.resize(Resize.scale().width(200))\\n\\t.border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;))\\n\\t.roundCorners(\\n\\tRoundCorners.max())\\n\\t)\\n\\t.adjust(Adjust.saturation().level(100))\\n\\t.adjust(Adjust.sharpen())\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(25))\\n\\t.adjust(Adjust.brightness().level(-90)))\\n\\t))\\n\\t.setSignature(\\&quot;e5VvY7Wl\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setCrop(\\&quot;imagga_crop\\&quot;).chain() .setWidth(200).setCrop(\\&quot;scale\\&quot;).chain() .setBorder(\\&quot;5px_solid_rgb:19340b\\&quot;).setRadius(\\&quot;max\\&quot;).chain() .setEffect(\\&quot;saturation:100\\&quot;).chain() .setEffect(\\&quot;sharpen\\&quot;).chain() .setEffect(\\&quot;brightness:-90\\&quot;).setFlags(\\&quot;relative\\&quot;).setOverlay(\\&quot;cloudinary_icon\\&quot;).setOpacity(25).setWidth(0.4).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\\n  .setCrop(\\&quot;imagga_crop\\&quot;).chain()\\n  .setWidth(200).setCrop(\\&quot;scale\\&quot;).chain()\\n  .setBorder(\\&quot;5px_solid_rgb:19340b\\&quot;).setRadius(\\&quot;max\\&quot;).chain()\\n  .setEffect(\\&quot;saturation:100\\&quot;).chain()\\n  .setEffect(\\&quot;sharpen\\&quot;).chain()\\n  .setEffect(\\&quot;brightness:-90\\&quot;).setFlags(\\&quot;relative\\&quot;).setOverlay(\\&quot;cloudinary_icon\\&quot;).setOpacity(25).setWidth(0.4).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;, signUrl: true)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().crop(\\&quot;imagga_crop\\&quot;).chain() .width(200).crop(\\&quot;scale\\&quot;).chain() .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain() .effect(\\&quot;saturation:100\\&quot;).chain() .effect(\\&quot;sharpen\\&quot;).chain() .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .crop(\\&quot;imagga_crop\\&quot;).chain()\\n  .width(200).crop(\\&quot;scale\\&quot;).chain()\\n  .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain()\\n  .effect(\\&quot;saturation:100\\&quot;).chain()\\n  .effect(\\&quot;sharpen\\&quot;).chain()\\n  .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).signed(true).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;c_imagga_crop\\\/c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\&quot;)\\n\\t.setSignature(\\&quot;e5VvY7Wl\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;c_imagga_crop\\\/c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\&quot;)\\n\\t.setSignature(\\&quot;e5VvY7Wl\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t resize(Resize.scale() { width(200) })\\n\\t border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;)) {\\n\\t roundCorners(\\n\\tRoundCorners.max())\\n\\t })\\n\\t adjust(Adjust.saturation() { level(100) })\\n\\t adjust(Adjust.sharpen())\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(25))\\n\\t adjust(Adjust.brightness() { level(-90) }) })\\n\\t }))\\n\\t signature() \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.imaggaCrop())\\n\\t resize(Resize.scale() { width(200) })\\n\\t border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;)) {\\n\\t roundCorners(\\n\\tRoundCorners.max())\\n\\t })\\n\\t adjust(Adjust.saturation() { level(100) })\\n\\t adjust(Adjust.sharpen())\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(25))\\n\\t adjust(Adjust.brightness() { level(-90) }) })\\n\\t }))\\n\\t signature() \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [ {crop: \\&quot;imagga_crop\\&quot;}, {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [\\n  {crop: \\&quot;imagga_crop\\&quot;},\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(imaggaCrop())\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  )\\n  .setSignature(\\&quot;e5VvY7Wl\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/s--e5VvY7Wl--\\\/c_imagga_crop\\\/c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\\/fat_cat.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[{&quot;crop_mode&quot;:&quot;imagga_crop&quot;},{&quot;crop_mode&quot;:&quot;scale&quot;,&quot;width&quot;:&quot;200&quot;},{&quot;border&quot;:&quot;5px_solid_rgb:19340b&quot;,&quot;radius&quot;:&quot;max&quot;},{&quot;effect&quot;:&quot;saturation:100&quot;},{&quot;effect&quot;:&quot;sharpen&quot;},{&quot;crop_mode&quot;:&quot;scale&quot;,&quot;effect&quot;:&quot;brightness:-90&quot;,&quot;flags&quot;:&quot;relative&quot;,&quot;overlay&quot;:&quot;cloudinary_icon&quot;,&quot;opacity&quot;:&quot;25&quot;,&quot;width&quot;:&quot;0.4&quot;}],&quot;transformation_string&quot;:&quot;c_imagga_crop\\\/c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;fat_cat.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;e5VvY7Wl&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--e5VvY7Wl--\/c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/s--e5VvY7Wl--\/c_imagga_crop\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg\" alt=\"Further image transformation of the smartly cropped photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"210\" height=\"272\"\/><\/a><\/p>\n<p>One last illustration: Apply the same image transformation without smartly cropping the original photo. Quite a difference, isn\u2019t it?<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [ {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;Transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;Transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;sharpen\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/Image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Image publicId=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\t&lt;Transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;Transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;sharpen\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/Image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;cld-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;cld-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;sharpen\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; :overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/cld-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\t&lt;cld-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;saturation:100\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;sharpen\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; :overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/cld-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt; &lt;cl-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;saturation:100\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;sharpen\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-image&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-image public-id=\\&quot;fat_cat.jpg\\&quot; &gt;\\n\\t&lt;cl-transformation width=\\&quot;200\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation border=\\&quot;5px_solid_rgb:19340b\\&quot; radius=\\&quot;max\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;saturation:100\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;sharpen\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;brightness:-90\\&quot; flags=\\&quot;relative\\&quot; overlay=\\&quot;cloudinary_icon\\&quot; opacity=\\&quot;25\\&quot; width=\\&quot;0.4\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-image&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {transformation: [ {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.imageTag(&#039;fat_cat.jpg&#039;, {transformation: [\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(transformation=[ {&#039;width&#039;: 200, &#039;crop&#039;: \\&quot;scale\\&quot;}, {&#039;border&#039;: \\&quot;5px_solid_rgb:19340b\\&quot;, &#039;radius&#039;: \\&quot;max\\&quot;}, {&#039;effect&#039;: \\&quot;saturation:100\\&quot;}, {&#039;effect&#039;: \\&quot;sharpen\\&quot;}, {&#039;effect&#039;: \\&quot;brightness:-90\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;opacity&#039;: 25, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;crop&#039;: \\&quot;scale\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;).image(transformation=[\\n  {&#039;width&#039;: 200, &#039;crop&#039;: \\&quot;scale\\&quot;},\\n  {&#039;border&#039;: \\&quot;5px_solid_rgb:19340b\\&quot;, &#039;radius&#039;: \\&quot;max\\&quot;},\\n  {&#039;effect&#039;: \\&quot;saturation:100\\&quot;},\\n  {&#039;effect&#039;: \\&quot;sharpen\\&quot;},\\n  {&#039;effect&#039;: \\&quot;brightness:-90\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;opacity&#039;: 25, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;crop&#039;: \\&quot;scale\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(200))\\n\\t-&gt;border(Border::solid(5,Color::rgb(\\&quot;19340b\\&quot;))\\n\\t-&gt;roundCorners(\\n\\tRoundCorners::max())\\n\\t)\\n\\t-&gt;adjust(Adjust::saturation()-&gt;level(100))\\n\\t-&gt;adjust(Adjust::sharpen())\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(25))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(-90)))\\n\\t));&quot;,&quot;codeSnippet&quot;:&quot;(new ImageTag(&#039;fat_cat.jpg&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(200))\\n\\t-&gt;border(Border::solid(5,Color::rgb(\\&quot;19340b\\&quot;))\\n\\t-&gt;roundCorners(\\n\\tRoundCorners::max())\\n\\t)\\n\\t-&gt;adjust(Adjust::saturation()-&gt;level(100))\\n\\t-&gt;adjust(Adjust::sharpen())\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(25))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(-90)))\\n\\t));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;), array(\\&quot;border\\&quot;=&gt;\\&quot;5px_solid_rgb:19340b\\&quot;, \\&quot;radius\\&quot;=&gt;\\&quot;max\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;saturation:100\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;sharpen\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;brightness:-90\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;opacity\\&quot;=&gt;25, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;width\\&quot;=&gt;200, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;),\\n  array(\\&quot;border\\&quot;=&gt;\\&quot;5px_solid_rgb:19340b\\&quot;, \\&quot;radius\\&quot;=&gt;\\&quot;max\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;saturation:100\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;sharpen\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;brightness:-90\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;opacity\\&quot;=&gt;25, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(200).crop(\\&quot;scale\\&quot;).chain() .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain() .effect(\\&quot;saturation:100\\&quot;).chain() .effect(\\&quot;sharpen\\&quot;).chain() .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .width(200).crop(\\&quot;scale\\&quot;).chain()\\n  .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain()\\n  .effect(\\&quot;saturation:100\\&quot;).chain()\\n  .effect(\\&quot;sharpen\\&quot;).chain()\\n  .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).imageTag(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, transformation: [ {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: 0.4, crop: \\&quot;scale\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_image_tag(\\&quot;fat_cat.jpg\\&quot;, transformation: [\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: \\&quot;cloudinary_icon\\&quot;, opacity: 25, width: 0.4, crop: \\&quot;scale\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(200).Crop(\\&quot;scale\\&quot;).Chain() .Border(\\&quot;5px_solid_rgb:19340b\\&quot;).Radius(\\&quot;max\\&quot;).Chain() .Effect(\\&quot;saturation:100\\&quot;).Chain() .Effect(\\&quot;sharpen\\&quot;).Chain() .Effect(\\&quot;brightness:-90\\&quot;).Flags(\\&quot;relative\\&quot;).Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Opacity(25).Width(0.4).Crop(\\&quot;scale\\&quot;)).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlImgUp.Transform(new Transformation()\\n  .Width(200).Crop(\\&quot;scale\\&quot;).Chain()\\n  .Border(\\&quot;5px_solid_rgb:19340b\\&quot;).Radius(\\&quot;max\\&quot;).Chain()\\n  .Effect(\\&quot;saturation:100\\&quot;).Chain()\\n  .Effect(\\&quot;sharpen\\&quot;).Chain()\\n  .Effect(\\&quot;brightness:-90\\&quot;).Flags(\\&quot;relative\\&quot;).Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Opacity(25).Width(0.4).Crop(\\&quot;scale\\&quot;)).BuildImageTag(\\&quot;fat_cat.jpg\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(200))\\n\\t.border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;))\\n\\t.roundCorners(\\n\\tRoundCorners.max())\\n\\t)\\n\\t.adjust(Adjust.saturation().level(100))\\n\\t.adjust(Adjust.sharpen())\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(25))\\n\\t.adjust(Adjust.brightness().level(-90)))\\n\\t)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(200))\\n\\t.border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;))\\n\\t.roundCorners(\\n\\tRoundCorners.max())\\n\\t)\\n\\t.adjust(Adjust.saturation().level(100))\\n\\t.adjust(Adjust.sharpen())\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(25))\\n\\t.adjust(Adjust.brightness().level(-90)))\\n\\t)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(200).setCrop(\\&quot;scale\\&quot;).chain() .setBorder(\\&quot;5px_solid_rgb:19340b\\&quot;).setRadius(\\&quot;max\\&quot;).chain() .setEffect(\\&quot;saturation:100\\&quot;).chain() .setEffect(\\&quot;sharpen\\&quot;).chain() .setEffect(\\&quot;brightness:-90\\&quot;).setFlags(\\&quot;relative\\&quot;).setOverlay(\\&quot;cloudinary_icon\\&quot;).setOpacity(25).setWidth(0.4).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;codeSnippet&quot;:&quot;imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\\n  .setWidth(200).setCrop(\\&quot;scale\\&quot;).chain()\\n  .setBorder(\\&quot;5px_solid_rgb:19340b\\&quot;).setRadius(\\&quot;max\\&quot;).chain()\\n  .setEffect(\\&quot;saturation:100\\&quot;).chain()\\n  .setEffect(\\&quot;sharpen\\&quot;).chain()\\n  .setEffect(\\&quot;brightness:-90\\&quot;).setFlags(\\&quot;relative\\&quot;).setOverlay(\\&quot;cloudinary_icon\\&quot;).setOpacity(25).setWidth(0.4).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;)!, cloudinary: cloudinary)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(200).crop(\\&quot;scale\\&quot;).chain() .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain() .effect(\\&quot;saturation:100\\&quot;).chain() .effect(\\&quot;sharpen\\&quot;).chain() .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .width(200).crop(\\&quot;scale\\&quot;).chain()\\n  .border(\\&quot;5px_solid_rgb:19340b\\&quot;).radius(\\&quot;max\\&quot;).chain()\\n  .effect(\\&quot;saturation:100\\&quot;).chain()\\n  .effect(\\&quot;sharpen\\&quot;).chain()\\n  .effect(\\&quot;brightness:-90\\&quot;).flags(\\&quot;relative\\&quot;).overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).opacity(25).width(0.4).crop(\\&quot;scale\\&quot;)).generate(\\&quot;fat_cat.jpg\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image(&#039;fat_cat.jpg&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.scale() { width(200) })\\n\\t border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;)) {\\n\\t roundCorners(\\n\\tRoundCorners.max())\\n\\t })\\n\\t adjust(Adjust.saturation() { level(100) })\\n\\t adjust(Adjust.sharpen())\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(25))\\n\\t adjust(Adjust.brightness() { level(-90) }) })\\n\\t })) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.image {\\n\\tpublicId(\\&quot;fat_cat.jpg\\&quot;)\\n\\t resize(Resize.scale() { width(200) })\\n\\t border(Border.solid(5,Color.rgb(\\&quot;19340b\\&quot;)) {\\n\\t roundCorners(\\n\\tRoundCorners.max())\\n\\t })\\n\\t adjust(Adjust.saturation() { level(100) })\\n\\t adjust(Adjust.sharpen())\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(25))\\n\\t adjust(Adjust.brightness() { level(-90) }) })\\n\\t })) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [ {width: 200, crop: \\&quot;scale\\&quot;}, {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;}, {effect: \\&quot;saturation:100\\&quot;}, {effect: \\&quot;sharpen\\&quot;}, {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.image(\\&quot;fat_cat.jpg\\&quot;, {transformation: [\\n  {width: 200, crop: \\&quot;scale\\&quot;},\\n  {border: \\&quot;5px_solid_rgb:19340b\\&quot;, radius: \\&quot;max\\&quot;},\\n  {effect: \\&quot;saturation:100\\&quot;},\\n  {effect: \\&quot;sharpen\\&quot;},\\n  {effect: \\&quot;brightness:-90\\&quot;, flags: \\&quot;relative\\&quot;, overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), opacity: 25, width: \\&quot;0.4\\&quot;, crop: \\&quot;scale\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryImage(\\&quot;fat_cat.jpg\\&quot;)\\n  .resize(scale().width(200))\\n  .border(solid(5, \\&quot;#19340b\\&quot;).roundCorners(max()))\\n  .adjust(saturation().level(100))\\n  .adjust(sharpen())\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .adjust(opacity(25))\\n          .adjust(brightness().level(-90))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/image\\\/upload\\\/c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\\\/fat_cat.jpg&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;image&quot;,&quot;transformation&quot;:[{&quot;crop_mode&quot;:&quot;scale&quot;,&quot;width&quot;:&quot;200&quot;},{&quot;border&quot;:&quot;5px_solid_rgb:19340b&quot;,&quot;radius&quot;:&quot;max&quot;},{&quot;effect&quot;:&quot;saturation:100&quot;},{&quot;effect&quot;:&quot;sharpen&quot;},{&quot;crop_mode&quot;:&quot;scale&quot;,&quot;effect&quot;:&quot;brightness:-90&quot;,&quot;flags&quot;:&quot;relative&quot;,&quot;overlay&quot;:&quot;cloudinary_icon&quot;,&quot;opacity&quot;:&quot;25&quot;,&quot;width&quot;:&quot;0.4&quot;}],&quot;transformation_string&quot;:&quot;c_scale,w_200\\\/bo_5px_solid_rgb:19340b,r_max\\\/e_saturation:100\\\/e_sharpen\\\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;fat_cat.jpg&quot;,&quot;extension&quot;:&quot;jpg&quot;,&quot;format&quot;:&quot;jpg&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;image&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/c_scale,w_200\/bo_5px_solid_rgb:19340b,r_max\/e_saturation:100\/e_sharpen\/c_scale,e_brightness:-90,fl_relative,l_cloudinary_icon,o_25,w_0.4\/fat_cat.jpg\" alt=\"Same transformation of the original photo\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"210\" height=\"144\"\/><\/a><\/p>\n<p>A final note &#8211; when you use the above URLs to generate images on-the-fly in Cloudinary, both the source and the resulting images are stored in the cloud, delivered to users using a fast CDN with advanced caching, and automatically optimized to reduce file size. So when you use Cloudinary to perform these smart image transformations, you also get optimal storage and delivery of images to users around the world.<\/p>\n<h2>Summary<\/h2>\n<p>Smart cropping is a must for any website or mobile application that involves user-uploaded images. Cloudinary\u2019s face-detection based cropping, together with Imagga\u2019s smart cropping, allows you to perform this cropping automatically with only a single line of code &#8211; and while making sure that images are stored and delivered in an optimal manner. \u00a0<\/p>\n<p>Want to try it out for yourself? Sign up for a <a href=\"https:\/\/cloudinary.com\/users\/register\/free\">free Cloudinary account<\/a> and also grab the <a href=\"https:\/\/cloudinary.com\/addons#imagga_crop\">Imagga Crop and Scale Add-on<\/a>. Additional documentation of the Imagga Add-on is available <a href=\"https:\/\/cloudinary.com\/documentation\/imagga_crop_and_scale_addon\">here<\/a>.<\/p>\n<p>We would be happy to hear any feedback or suggestion you may have.<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":41,"featured_media":24067,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[91,92,165,176,214,229,257],"class_list":["post-21227","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-django","tag-dotnet","tag-image-transformation","tag-java","tag-node","tag-php","tag-ruby-on-rails"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.6 (Yoast SEO v26.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Beyond face detection - smart cropping with Imagga &amp; Cloudinary<\/title>\n<meta name=\"description\" content=\"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Beyond face detection - smart cropping in the cloud using Imagga and Cloudinary\" \/>\n<meta property=\"og:description\" content=\"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2014-04-25T11:12:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-15T21:01:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga-png?_i=AA\" \/>\n\t<meta property=\"og:image:width\" content=\"2000\" \/>\n\t<meta property=\"og:image:height\" content=\"1100\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"NewsArticle\",\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Beyond face detection &#8211; smart cropping in the cloud using Imagga and Cloudinary\",\"datePublished\":\"2014-04-25T11:12:29+00:00\",\"dateModified\":\"2024-08-15T21:01:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\"},\"wordCount\":13,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA\",\"keywords\":[\"Django\",\"DotNet\",\"Image Transformation\",\"Java\",\"Node\",\"PHP\",\"Ruby on Rails\"],\"inLanguage\":\"en-US\",\"copyrightYear\":\"2014\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\",\"url\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\",\"name\":\"Beyond face detection - smart cropping with Imagga & Cloudinary\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA\",\"datePublished\":\"2014-04-25T11:12:29+00:00\",\"dateModified\":\"2024-08-15T21:01:03+00:00\",\"description\":\"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA\",\"width\":2000,\"height\":1100},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Beyond face detection &#8211; smart cropping in the cloud using Imagga and Cloudinary\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"name\":\"Cloudinary Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cloudinary.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\",\"name\":\"Cloudinary Blog\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"width\":312,\"height\":60,\"caption\":\"Cloudinary Blog\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Beyond face detection - smart cropping with Imagga & Cloudinary","description":"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","og_locale":"en_US","og_type":"article","og_title":"Beyond face detection - smart cropping in the cloud using Imagga and Cloudinary","og_description":"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.","og_url":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","og_site_name":"Cloudinary Blog","article_published_time":"2014-04-25T11:12:29+00:00","article_modified_time":"2024-08-15T21:01:03+00:00","og_image":[{"width":2000,"height":1100,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga-png?_i=AA","type":"image\/png"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary"},"author":{"name":"","@id":""},"headline":"Beyond face detection &#8211; smart cropping in the cloud using Imagga and Cloudinary","datePublished":"2014-04-25T11:12:29+00:00","dateModified":"2024-08-15T21:01:03+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary"},"wordCount":13,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA","keywords":["Django","DotNet","Image Transformation","Java","Node","PHP","Ruby on Rails"],"inLanguage":"en-US","copyrightYear":"2014","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","url":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary","name":"Beyond face detection - smart cropping with Imagga & Cloudinary","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA","datePublished":"2014-04-25T11:12:29+00:00","dateModified":"2024-08-15T21:01:03+00:00","description":"Do you need to adapt user-uploaded images to a fixed graphic design? See how to easily do smart cropping based on detection of faces and other objects.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA","width":2000,"height":1100},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/beyond_face_detection_smart_cropping_in_the_cloud_using_imagga_and_cloudinary#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Beyond face detection &#8211; smart cropping in the cloud using Imagga and Cloudinary"}]},{"@type":"WebSite","@id":"https:\/\/cloudinary.com\/blog\/#website","url":"https:\/\/cloudinary.com\/blog\/","name":"Cloudinary Blog","description":"","publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cloudinary.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cloudinary.com\/blog\/#organization","name":"Cloudinary Blog","url":"https:\/\/cloudinary.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","width":312,"height":60,"caption":"Cloudinary Blog"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":""}]}},"jetpack_featured_media_url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1650586083\/77_beyond-face-detection-imagga\/77_beyond-face-detection-imagga.png?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21227","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/comments?post=21227"}],"version-history":[{"count":3,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21227\/revisions"}],"predecessor-version":[{"id":35211,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21227\/revisions\/35211"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/24067"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21227"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21227"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21227"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}