> ## Documentation Index
> Fetch the complete documentation index at: https://cloudinary.com/documentation/llms.txt
> Use this file to discover all available pages before exploring further.

# Advanced conditional transformations


To apply a transformation only when a condition is met, you can embed a transformation directly within a condition in your URL or SDK call, using the format `if_condition/transformation/if_end`. 

This page covers advanced techniques: combining multiple conditions with AND/OR logic, and defining fallback transformations using else branches.

For the basics of this syntax and worked examples, see [Specifying transformations for a condition](using_conditional_transformations). For details on the conditions themselves, see [Specifying conditions](conditional_transformations).


## Multiple AND | OR conditions
You can specify multiple conditions to evaluate by joining the conditions with 'AND' or 'OR' conjunction operators.

> **NOTE**: 'AND' operators are evaluated before 'OR' operators.
For example, to crop the image to a width of 300 pixels and a height of 200 pixels, only if the aspect ratio is greater than 3:4, the width is greater than 300, and the height is greater than 200 (`if_ar_gt_3:4_and_w_gt_300_and_h_gt_200`):

![Multiple conditions](https://res.cloudinary.com/demo/image/upload/if_ar_gt_3:4_and_w_gt_300_and_h_gt_200,c_crop,w_300,h_200/docs/fruit-stand.jpg)

```nodejs
cloudinary.image("docs/fruit-stand.jpg", {if: "ar_gt_3:4_and_w_gt_300_and_h_gt_200", width: 300, height: 200, crop: "crop"})
```

```react
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { crop } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/fruit-stand.jpg").conditional(
  ifCondition(
    "aspect_ratio > 3:4 && width > 300 && height > 200",
    new Transformation().resize(crop().width(300).height(200))
  )
);
```

```vue
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { crop } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/fruit-stand.jpg").conditional(
  ifCondition(
    "aspect_ratio > 3:4 && width > 300 && height > 200",
    new Transformation().resize(crop().width(300).height(200))
  )
);
```

```angular
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { crop } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/fruit-stand.jpg").conditional(
  ifCondition(
    "aspect_ratio > 3:4 && width > 300 && height > 200",
    new Transformation().resize(crop().width(300).height(200))
  )
);
```

```js
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { crop } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/fruit-stand.jpg").conditional(
  ifCondition(
    "aspect_ratio > 3:4 && width > 300 && height > 200",
    new Transformation().resize(crop().width(300).height(200))
  )
);
```

```python
CloudinaryImage("docs/fruit-stand.jpg").image(if="ar_gt_3:4_and_w_gt_300_and_h_gt_200", width=300, height=200, crop="crop")
```

```php
use Cloudinary\Transformation\Conditional;
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/fruit-stand.jpg'))
	->conditional(Conditional::ifCondition("aspect_ratio > 3:4 && width > 300 && height > 200",(new Transformation())
	->resize(Resize::crop()->width(300)
->height(200))));
```

```java
cloudinary.url().transformation(new Transformation().if("ar_gt_3:4_and_w_gt_300_and_h_gt_200").width(300).height(200).crop("crop")).imageTag("docs/fruit-stand.jpg");
```

```ruby
cl_image_tag("docs/fruit-stand.jpg", if: "ar_gt_3:4_and_w_gt_300_and_h_gt_200", width: 300, height: 200, crop: "crop")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().If("ar_gt_3:4_and_w_gt_300_and_h_gt_200").Width(300).Height(200).Crop("crop")).BuildImageTag("docs/fruit-stand.jpg")
```

```dart
cloudinary.image('docs/fruit-stand.jpg').transformation(Transformation()
	.addTransformation("if_ar_gt_3:4_and_w_gt_300_and_h_gt_200,c_crop,w_300,h_200"));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setIf("ar_gt_3:4_and_w_gt_300_and_h_gt_200").setWidth(300).setHeight(200).setCrop("crop")).generate("docs/fruit-stand.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().if("ar_gt_3:4_and_w_gt_300_and_h_gt_200").width(300).height(200).crop("crop")).generate("docs/fruit-stand.jpg");
```

```flutter
cloudinary.image('docs/fruit-stand.jpg').transformation(Transformation()
	.addTransformation("if_ar_gt_3:4_and_w_gt_300_and_h_gt_200,c_crop,w_300,h_200"));
```

```kotlin
cloudinary.image {
	publicId("docs/fruit-stand.jpg")
	 addTransformation("if_ar_gt_3:4_and_w_gt_300_and_h_gt_200,c_crop,w_300,h_200") 
}.generate()
```

```jquery
$.cloudinary.image("docs/fruit-stand.jpg", {if: "ar_gt_3:4_and_w_gt_300_and_h_gt_200", width: 300, height: 200, crop: "crop"})
```

```react_native
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { crop } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/fruit-stand.jpg").conditional(
  ifCondition(
    "aspect_ratio > 3:4 && width > 300 && height > 200",
    new Transformation().resize(crop().width(300).height(200))
  )
);
```
> **NOTE**: It's also possible to define multiple separate conditions, each with its own transformation result by using multiple `if...end_if` chained components in the URL.
## Else branch transformations
You can specify a transformation that is applied in the case that the initial condition is evaluated as false (and hence the transformations associated with the condition are not applied), by using the `if_else` parameter to specify this fallback transformation.
For example, images with an original width less than or equal to 400px scale to fill a 240x120px container (`if_iw_lte_400/c_fill,h_120,w_240`), while images with an original width larger than 400px scale to fill a 240x400px container (`if_else/c_fill,h_240,w_400`):

![Else conditions](https://res.cloudinary.com/demo/image/upload/if_iw_lte_400/c_fill,h_120,w_240/if_else/c_fill,h_240,w_400/if_end/docs/shoppable_bag.jpg)

```nodejs
cloudinary.image("docs/shoppable_bag.jpg", {transformation: [
  {if: "iw_lte_400"},
  {height: 120, width: 240, crop: "fill"},
  {if: "else"},
  {height: 240, width: 400, crop: "fill"},
  {if: "end"}
  ]})
```

```react
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/shoppable_bag.jpg").conditional(
  ifCondition(
    "iw_lte_400",
    new Transformation().resize(fill().width(240).height(120))
  ).otherwise(new Transformation().resize(fill().width(400).height(240)))
);
```

```vue
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/shoppable_bag.jpg").conditional(
  ifCondition(
    "iw_lte_400",
    new Transformation().resize(fill().width(240).height(120))
  ).otherwise(new Transformation().resize(fill().width(400).height(240)))
);
```

```angular
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/shoppable_bag.jpg").conditional(
  ifCondition(
    "iw_lte_400",
    new Transformation().resize(fill().width(240).height(120))
  ).otherwise(new Transformation().resize(fill().width(400).height(240)))
);
```

```js
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/shoppable_bag.jpg").conditional(
  ifCondition(
    "iw_lte_400",
    new Transformation().resize(fill().width(240).height(120))
  ).otherwise(new Transformation().resize(fill().width(400).height(240)))
);
```

```python
CloudinaryImage("docs/shoppable_bag.jpg").image(transformation=[
  {'if': "iw_lte_400"},
  {'height': 120, 'width': 240, 'crop': "fill"},
  {'if': "else"},
  {'height': 240, 'width': 400, 'crop': "fill"},
  {'if': "end"}
  ])
```

```php
use Cloudinary\Transformation\Conditional;
use Cloudinary\Transformation\Resize;

(new ImageTag('docs/shoppable_bag.jpg'))
	->conditional(Conditional::ifCondition("iw_lte_400",(new Transformation())
	->resize(Resize::fill()->width(240)
->height(120)))
	->otherwise((new Transformation())
	->resize(Resize::fill()->width(400)
->height(240)))
	);
```

```java
cloudinary.url().transformation(new Transformation()
  .if("iw_lte_400").chain()
  .height(120).width(240).crop("fill").chain()
  .if("else").chain()
  .height(240).width(400).crop("fill").chain()
  .if("end")).imageTag("docs/shoppable_bag.jpg");
```

```ruby
cl_image_tag("docs/shoppable_bag.jpg", transformation: [
  {if: "iw_lte_400"},
  {height: 120, width: 240, crop: "fill"},
  {if: "else"},
  {height: 240, width: 400, crop: "fill"},
  {if: "end"}
  ])
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation()
  .If("iw_lte_400").Chain()
  .Height(120).Width(240).Crop("fill").Chain()
  .If("else").Chain()
  .Height(240).Width(400).Crop("fill").Chain()
  .If("end")).BuildImageTag("docs/shoppable_bag.jpg")
```

```dart
cloudinary.image('docs/shoppable_bag.jpg').transformation(Transformation()
	.addTransformation("if_iw_lte_400/c_fill,h_120,w_240/if_else/c_fill,h_240,w_400/if_end"));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()
  .setIf("iw_lte_400").chain()
  .setHeight(120).setWidth(240).setCrop("fill").chain()
  .setIf("else").chain()
  .setHeight(240).setWidth(400).setCrop("fill").chain()
  .setIf("end")).generate("docs/shoppable_bag.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation()
  .if("iw_lte_400").chain()
  .height(120).width(240).crop("fill").chain()
  .if("else").chain()
  .height(240).width(400).crop("fill").chain()
  .if("end")).generate("docs/shoppable_bag.jpg");
```

```flutter
cloudinary.image('docs/shoppable_bag.jpg').transformation(Transformation()
	.addTransformation("if_iw_lte_400/c_fill,h_120,w_240/if_else/c_fill,h_240,w_400/if_end"));
```

```kotlin
cloudinary.image {
	publicId("docs/shoppable_bag.jpg")
	 addTransformation("if_iw_lte_400/c_fill,h_120,w_240/if_else/c_fill,h_240,w_400/if_end") 
}.generate()
```

```jquery
$.cloudinary.image("docs/shoppable_bag.jpg", {transformation: [
  {if: "iw_lte_400"},
  {height: 120, width: 240, crop: "fill"},
  {if: "else"},
  {height: 240, width: 400, crop: "fill"},
  {if: "end"}
  ]})
```

```react_native
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";

new CloudinaryImage("docs/shoppable_bag.jpg").conditional(
  ifCondition(
    "iw_lte_400",
    new Transformation().resize(fill().width(240).height(120))
  ).otherwise(new Transformation().resize(fill().width(400).height(240)))
);
```

 
In cases where the `if` condition is not in the preceding transformation component, then the `if_else` parameter also acts as an `if_end` parameter: all chained transformation components until the one with `if_else` are only applied if the previous condition holds true. Multiple conditional transformations can also be applied by adding an `if_end` parameter to the last transformation component in the chain, and to avoid ambiguity, the component with the `if_else` parameter should not have additional transformation instructions.
For example, if the width is less than or equal to 400 pixels then fill the image to 220x180 and add a red effect, else if the width is greater than 400 pixels then fill the image to 190x300 and add an oil painting effect:

![Multiple else branch conditions](https://res.cloudinary.com/demo/image/upload/if_w_lte_400/c_fill,h_220,w_180/e_red/if_else/c_fill,h_190,w_300/e_oil_paint/if_end/docs/cappuccino.jpg)

```nodejs
cloudinary.image("docs/cappuccino.jpg", {transformation: [
  {if: "w_lte_400"},
  {height: 220, width: 180, crop: "fill"},
  {effect: "red"},
  {if: "else"},
  {height: 190, width: 300, crop: "fill"},
  {effect: "oil_paint"},
  {if: "end"}
  ]})
```

```react
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";
import { red } from "@cloudinary/url-gen/actions/adjust";
import { oilPaint } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/cappuccino.jpg").conditional(
  ifCondition(
    "w_lte_400",
    new Transformation().resize(fill().width(180).height(220)).adjust(red())
  ).otherwise(
    new Transformation()
      .resize(fill().width(300).height(190))
      .effect(oilPaint())
  )
);
```

```vue
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";
import { red } from "@cloudinary/url-gen/actions/adjust";
import { oilPaint } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/cappuccino.jpg").conditional(
  ifCondition(
    "w_lte_400",
    new Transformation().resize(fill().width(180).height(220)).adjust(red())
  ).otherwise(
    new Transformation()
      .resize(fill().width(300).height(190))
      .effect(oilPaint())
  )
);
```

```angular
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";
import { red } from "@cloudinary/url-gen/actions/adjust";
import { oilPaint } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/cappuccino.jpg").conditional(
  ifCondition(
    "w_lte_400",
    new Transformation().resize(fill().width(180).height(220)).adjust(red())
  ).otherwise(
    new Transformation()
      .resize(fill().width(300).height(190))
      .effect(oilPaint())
  )
);
```

```js
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";
import { red } from "@cloudinary/url-gen/actions/adjust";
import { oilPaint } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/cappuccino.jpg").conditional(
  ifCondition(
    "w_lte_400",
    new Transformation().resize(fill().width(180).height(220)).adjust(red())
  ).otherwise(
    new Transformation()
      .resize(fill().width(300).height(190))
      .effect(oilPaint())
  )
);
```

```python
CloudinaryImage("docs/cappuccino.jpg").image(transformation=[
  {'if': "w_lte_400"},
  {'height': 220, 'width': 180, 'crop': "fill"},
  {'effect': "red"},
  {'if': "else"},
  {'height': 190, 'width': 300, 'crop': "fill"},
  {'effect': "oil_paint"},
  {'if': "end"}
  ])
```

```php
use Cloudinary\Transformation\Conditional;
use Cloudinary\Transformation\Resize;
use Cloudinary\Transformation\Adjust;
use Cloudinary\Transformation\Effect;

(new ImageTag('docs/cappuccino.jpg'))
	->conditional(Conditional::ifCondition("w_lte_400",(new Transformation())
	->resize(Resize::fill()->width(180)
->height(220))
	->adjust(Adjust::red()))
	->otherwise((new Transformation())
	->resize(Resize::fill()->width(300)
->height(190))
	->effect(Effect::oilPaint()))
	);
```

```java
cloudinary.url().transformation(new Transformation()
  .if("w_lte_400").chain()
  .height(220).width(180).crop("fill").chain()
  .effect("red").chain()
  .if("else").chain()
  .height(190).width(300).crop("fill").chain()
  .effect("oil_paint").chain()
  .if("end")).imageTag("docs/cappuccino.jpg");
```

```ruby
cl_image_tag("docs/cappuccino.jpg", transformation: [
  {if: "w_lte_400"},
  {height: 220, width: 180, crop: "fill"},
  {effect: "red"},
  {if: "else"},
  {height: 190, width: 300, crop: "fill"},
  {effect: "oil_paint"},
  {if: "end"}
  ])
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation()
  .If("w_lte_400").Chain()
  .Height(220).Width(180).Crop("fill").Chain()
  .Effect("red").Chain()
  .If("else").Chain()
  .Height(190).Width(300).Crop("fill").Chain()
  .Effect("oil_paint").Chain()
  .If("end")).BuildImageTag("docs/cappuccino.jpg")
```

```dart
cloudinary.image('docs/cappuccino.jpg').transformation(Transformation()
	.addTransformation("if_w_lte_400/c_fill,h_220,w_180/e_red/if_else/c_fill,h_190,w_300/e_oil_paint/if_end"));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()
  .setIf("w_lte_400").chain()
  .setHeight(220).setWidth(180).setCrop("fill").chain()
  .setEffect("red").chain()
  .setIf("else").chain()
  .setHeight(190).setWidth(300).setCrop("fill").chain()
  .setEffect("oil_paint").chain()
  .setIf("end")).generate("docs/cappuccino.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation()
  .if("w_lte_400").chain()
  .height(220).width(180).crop("fill").chain()
  .effect("red").chain()
  .if("else").chain()
  .height(190).width(300).crop("fill").chain()
  .effect("oil_paint").chain()
  .if("end")).generate("docs/cappuccino.jpg");
```

```flutter
cloudinary.image('docs/cappuccino.jpg').transformation(Transformation()
	.addTransformation("if_w_lte_400/c_fill,h_220,w_180/e_red/if_else/c_fill,h_190,w_300/e_oil_paint/if_end"));
```

```kotlin
cloudinary.image {
	publicId("docs/cappuccino.jpg")
	 addTransformation("if_w_lte_400/c_fill,h_220,w_180/e_red/if_else/c_fill,h_190,w_300/e_oil_paint/if_end") 
}.generate()
```

```jquery
$.cloudinary.image("docs/cappuccino.jpg", {transformation: [
  {if: "w_lte_400"},
  {height: 220, width: 180, crop: "fill"},
  {effect: "red"},
  {if: "else"},
  {height: 190, width: 300, crop: "fill"},
  {effect: "oil_paint"},
  {if: "end"}
  ]})
```

```react_native
import { ifCondition } from "@cloudinary/url-gen/actions/conditional";
import { fill } from "@cloudinary/url-gen/actions/resize";
import { red } from "@cloudinary/url-gen/actions/adjust";
import { oilPaint } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/cappuccino.jpg").conditional(
  ifCondition(
    "w_lte_400",
    new Transformation().resize(fill().width(180).height(220)).adjust(red())
  ).otherwise(
    new Transformation()
      .resize(fill().width(300).height(190))
      .effect(oilPaint())
  )
);
```


## Advanced conditional transformation examples

* **Conditional cropping mode based on illustration score**: This example ensures that uploaded graphics such as logos are never cut off, even if the art design significantly changes the required aspect ratio of the delivered image. Using the same transformation, photos scale and crop to completely fill the full space available. Using the `ils` conditional characteristic for both URLs below, Cloudinary resizes the `cloudinary_icon_blue` logo to the required portrait size using the `pad` method, and resizes the `flower_shop` photo to the same aspect ratio using the `fill` method:
![icon with conditional pad cropping](https://res.cloudinary.com/demo/image/upload/if_ils_gt_0.5/b_lightgray,c_pad,h_200,w_150/if_else/c_fill,h_200,w_150/if_end/cloudinary_icon_blue.jpg )
![photo with conditional fill cropping](https://res.cloudinary.com/demo/image/upload/if_ils_gt_0.5/b_lightgray,c_pad,h_200,w_150/if_else/c_fill,h_200,w_150/if_end/docs/flower_shop.jpg )

> **READING**:
>
> * [Specifying conditions](conditional_transformations): Learn how to define conditions based on image characteristics, operators, and parameters.

> * [Specifying transformations for a condition](using_conditional_transformations): Learn the syntax for applying transformations when a condition is met, including chained transformations and worked examples.