> ## Documentation Index
> This page is part of the Image and Video APIs product. Fetch the complete documentation index for Image and Video APIs at: https://cloudinary.com/documentation/llms-image-and-video-apis.txt?referrer=docpage and then use it to discover all relevant pages before exploring further.
> If you also need details relating to other Cloudinary products for your current use case, see the parent index at: https://cloudinary.com/documentation/llms.txt?referrer=docpage

# Generative recolor


Recolor elements of your images using generative AI.

In e-commerce, this lets you present every color a product comes in, such as apparel, furniture, or accessories, from a single photograph rather than shooting each variant. Shoppers see accurate options generated on the fly, while your team avoids producing and storing dozens of near-identical images.

> **See also**:
>
> Explore the complete syntax and all options for this effect, or try it out on your own images in the Console:

> * **See full syntax**: [e_gen_recolor](transformation_reference#e_gen_recolor) in the _Transformation Reference_

> * **Try it out**: [Generative recolor](https://console.cloudinary.com/app/image/playground/generative-recolor?media=image&collection=armchair&sample=me%2Fgr-chair-1.jpg&prompts=armchair&color=%23FF00FF&detectMultiple=true)

## Generative recolor overview

Use natural language to describe what you want to recolor in the image. For example, turn the jacket on the right pink (`e_gen_recolor:prompt_the%20jacket%20on%20the%20right;to-color_pink`):

![Jacket on the right recolored to pink](https://res.cloudinary.com/demo/image/upload/e_gen_recolor:prompt_the%20jacket%20on%20the%20right;to-color_pink/docs/jackets.jpg "with_image:false")

```nodejs
cloudinary.image("docs/jackets.jpg", {effect: "gen_recolor:prompt_the jacket on the right;to-color_pink"})
```

```react
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/jackets.jpg").effect(
  generativeRecolor("the jacket on the right", "pink")
);
```

```vue
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/jackets.jpg").effect(
  generativeRecolor("the jacket on the right", "pink")
);
```

```angular
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/jackets.jpg").effect(
  generativeRecolor("the jacket on the right", "pink")
);
```

```js
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/jackets.jpg").effect(
  generativeRecolor("the jacket on the right", "pink")
);
```

```python
CloudinaryImage("docs/jackets.jpg").image(effect="gen_recolor:prompt_the jacket on the right;to-color_pink")
```

```php
use Cloudinary\Transformation\Effect;

(new ImageTag('docs/jackets.jpg'))
	->effect(Effect::generativeRecolor("the jacket on the right",Color::PINK));
```

```java
cloudinary.url().transformation(new Transformation().effect("gen_recolor:prompt_the jacket on the right;to-color_pink")).imageTag("docs/jackets.jpg");
```

```ruby
cl_image_tag("docs/jackets.jpg", effect: "gen_recolor:prompt_the jacket on the right;to-color_pink")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect("gen_recolor:prompt_the jacket on the right;to-color_pink")).BuildImageTag("docs/jackets.jpg")
```

```dart
cloudinary.image('docs/jackets.jpg').transformation(Transformation()
	.effect(Effect.generativeRecolor("the jacket on the right",Color.PINK)));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect("gen_recolor:prompt_the jacket on the right;to-color_pink")).generate("docs/jackets.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().effect("gen_recolor:prompt_the jacket on the right;to-color_pink")).generate("docs/jackets.jpg");
```

```flutter
cloudinary.image('docs/jackets.jpg').transformation(Transformation()
	.effect(Effect.generativeRecolor("the jacket on the right",Color.PINK)));
```

```kotlin
cloudinary.image {
	publicId("docs/jackets.jpg")
	 effect(Effect.generativeRecolor("the jacket on the right",Color.PINK)) 
}.generate()
```

```jquery
$.cloudinary.image("docs/jackets.jpg", {effect: "gen_recolor:prompt_the jacket on the right;to-color_pink"})
```

```react_native
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/jackets.jpg").effect(
  generativeRecolor("the jacket on the right", "pink")
);
```

Original image

Right jacket recolored pink

## Recolor multiple elements

To recolor all instances of the prompt in the image, specify `multiple_true`, for example, recolor all the devices in the following image to a particular orange color, with hex code `EA672A`:

![All devices recolored orange](https://res.cloudinary.com/demo/image/upload/e_gen_recolor:prompt_device;to-color_EA672A;multiple_true/docs/devices.jpg "with_image:false")

```nodejs
cloudinary.image("docs/devices.jpg", {effect: "gen_recolor:prompt_device;to-color_EA672A;multiple_true"})
```

```react
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/devices.jpg").effect(
  generativeRecolor("device", "#EA672A").detectMultiple()
);
```

```vue
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/devices.jpg").effect(
  generativeRecolor("device", "#EA672A").detectMultiple()
);
```

```angular
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/devices.jpg").effect(
  generativeRecolor("device", "#EA672A").detectMultiple()
);
```

```js
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/devices.jpg").effect(
  generativeRecolor("device", "#EA672A").detectMultiple()
);
```

```python
CloudinaryImage("docs/devices.jpg").image(effect="gen_recolor:prompt_device;to-color_EA672A;multiple_True")
```

```php
use Cloudinary\Transformation\Effect;
use Cloudinary\Transformation\Color;

(new ImageTag('docs/devices.jpg'))
	->effect(Effect::generativeRecolor("device",Color::rgb("EA672A"))->detectMultiple());
```

```java
cloudinary.url().transformation(new Transformation().effect("gen_recolor:prompt_device;to-color_EA672A;multiple_true")).imageTag("docs/devices.jpg");
```

```ruby
cl_image_tag("docs/devices.jpg", effect: "gen_recolor:prompt_device;to-color_EA672A;multiple_true")
```

```csharp
cloudinary.Api.UrlImgUp.Transform(new Transformation().Effect("gen_recolor:prompt_device;to-color_EA672A;multiple_true")).BuildImageTag("docs/devices.jpg")
```

```dart
cloudinary.image('docs/devices.jpg').transformation(Transformation()
	.effect(Effect.generativeRecolor("device",Color.rgb("EA672A")).detectMultiple()));
```

```swift
imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setEffect("gen_recolor:prompt_device;to-color_EA672A;multiple_true")).generate("docs/devices.jpg")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().effect("gen_recolor:prompt_device;to-color_EA672A;multiple_true")).generate("docs/devices.jpg");
```

```flutter
cloudinary.image('docs/devices.jpg').transformation(Transformation()
	.effect(Effect.generativeRecolor("device",Color.rgb("EA672A")).detectMultiple()));
```

```kotlin
cloudinary.image {
	publicId("docs/devices.jpg")
	 effect(Effect.generativeRecolor("device",Color.rgb("EA672A")) { detectMultiple() }) 
}.generate()
```

```jquery
$.cloudinary.image("docs/devices.jpg", {effect: "gen_recolor:prompt_device;to-color_EA672A;multiple_true"})
```

```react_native
import { generativeRecolor } from "@cloudinary/url-gen/actions/effect";

new CloudinaryImage("docs/devices.jpg").effect(
  generativeRecolor("device", "#EA672A").detectMultiple()
);
```

Original image

All devices recolored orange

> **TIP**: Consider using [Replace color](color_effects#replace_color_effect) if you want to recolor everything of a particular color in your image, rather than specific elements.

If there are a number of different things that you want to recolor, you can specify more than one prompt. Note that when you specify more than one prompt, multiple instances of each prompt are recolored, regardless of the `multiple` parameter setting. For example, in this image, all devices and both people's hair are recolored:

![Devices and hair recolored](https://res.cloudinary.com/demo/image/upload/e_gen_recolor:prompt_(device;hair)

```nodejs
cloudinary.image("e_gen_recolor:prompt_(device;hair")
```

```react
new CloudinaryImage("e_gen_recolor:prompt_(device;hair");
```

```vue
new CloudinaryImage("e_gen_recolor:prompt_(device;hair");
```

```angular
new CloudinaryImage("e_gen_recolor:prompt_(device;hair");
```

```js
new CloudinaryImage("e_gen_recolor:prompt_(device;hair");
```

```python
CloudinaryImage("e_gen_recolor:prompt_(device;hair").image()
```

```php
(new ImageTag('e_gen_recolor:prompt_(device;hair'));
```

```java
cloudinary.url().transformation(new Transformation().imageTag("e_gen_recolor:prompt_(device;hair");
```

```ruby
cl_image_tag("e_gen_recolor:prompt_(device;hair")
```

```csharp
cloudinary.Api.UrlImgUp.BuildImageTag("e_gen_recolor:prompt_(device;hair")
```

```dart
cloudinary.image('e_gen_recolor:prompt_(device;hair').transformation(Transformation());
```

```swift
imageView.cldSetImage(cloudinary.createUrl().generate("e_gen_recolor:prompt_(device;hair")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().generate("e_gen_recolor:prompt_(device;hair");
```

```flutter
cloudinary.image('e_gen_recolor:prompt_(device;hair').transformation(Transformation());
```

```kotlin
cloudinary.image {
	publicId("e_gen_recolor:prompt_(device;hair") 
}.generate()
```

```jquery
$.cloudinary.image("e_gen_recolor:prompt_(device;hair")
```

```react_native
new CloudinaryImage("e_gen_recolor:prompt_(device;hair");
```;to-color_EA672A/docs/devices.jpg "thumb:w_400, width:400")

## Recolor multicolored objects

If the items to recolor contain many colors, you can specify the colors to change based on their dominance in the items (using a zero-based index). For example, in the image below, the blue is the third most dominant color of the dress and the most dominant color of the jacket.  Therefore, to recolor both of these to a burgundy color (hex color #800020), you can chain two recolor actions:

* `e_gen_recolor:prompt_dress;apply-to-tier_(2);to-color_800020`: recolors the third most dominant color in the dress to burgundy.
* `e_gen_recolor:prompt_jacket;apply-to-tier_(0);to-color_800020`: recolors the most dominant color in the jacket to burgundy.

![Change the blue in the dress and jacket to burgundy](https://res.cloudinary.com/demo/image/upload/e_gen_recolor:prompt_dress;apply-to-tier_(2)

```nodejs
cloudinary.image("e_gen_recolor:prompt_dress;apply-to-tier_(2")
```

```react
new CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```vue
new CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```angular
new CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```js
new CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```python
CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2").image()
```

```php
(new ImageTag('e_gen_recolor:prompt_dress;apply-to-tier_(2'));
```

```java
cloudinary.url().transformation(new Transformation().imageTag("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```ruby
cl_image_tag("e_gen_recolor:prompt_dress;apply-to-tier_(2")
```

```csharp
cloudinary.Api.UrlImgUp.BuildImageTag("e_gen_recolor:prompt_dress;apply-to-tier_(2")
```

```dart
cloudinary.image('e_gen_recolor:prompt_dress;apply-to-tier_(2').transformation(Transformation());
```

```swift
imageView.cldSetImage(cloudinary.createUrl().generate("e_gen_recolor:prompt_dress;apply-to-tier_(2")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().generate("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```

```flutter
cloudinary.image('e_gen_recolor:prompt_dress;apply-to-tier_(2').transformation(Transformation());
```

```kotlin
cloudinary.image {
	publicId("e_gen_recolor:prompt_dress;apply-to-tier_(2") 
}.generate()
```

```jquery
$.cloudinary.image("e_gen_recolor:prompt_dress;apply-to-tier_(2")
```

```react_native
new CloudinaryImage("e_gen_recolor:prompt_dress;apply-to-tier_(2");
```;to-color_800020/e_gen_recolor:prompt_jacket;apply-to-tier_(0);to-color_800020/docs/pattern-dress.jpg "with_image:false")

Original image

Color changes by dominance

Specify multiple colors to change by separating the dominant indices with semicolons.  For example, change the fourth and fifth most dominant colors to green (hex color #58d68d) in the sweater (`prompt_sweater;to-color_58d68d;apply-to-tier_(3;4)`).  The yellow and gray colors change to green:

![Change the fourth and fifth most dominant colors to green](https://res.cloudinary.com/demo/image/upload/e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4)

```nodejs
cloudinary.image("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4")
```

```react
new CloudinaryImage(
  "e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4"
);
```

```vue
new CloudinaryImage(
  "e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4"
);
```

```angular
new CloudinaryImage(
  "e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4"
);
```

```js
new CloudinaryImage(
  "e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4"
);
```

```python
CloudinaryImage("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4").image()
```

```php
(new ImageTag('e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4'));
```

```java
cloudinary.url().transformation(new Transformation().imageTag("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4");
```

```ruby
cl_image_tag("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4")
```

```csharp
cloudinary.Api.UrlImgUp.BuildImageTag("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4")
```

```dart
cloudinary.image('e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4').transformation(Transformation());
```

```swift
imageView.cldSetImage(cloudinary.createUrl().generate("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4")!, cloudinary: cloudinary)
```

```android
MediaManager.get().url().transformation(new Transformation().generate("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4");
```

```flutter
cloudinary.image('e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4').transformation(Transformation());
```

```kotlin
cloudinary.image {
	publicId("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4") 
}.generate()
```

```jquery
$.cloudinary.image("e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4")
```

```react_native
new CloudinaryImage(
  "e_gen_recolor:prompt_sweater;to-color_58d68d;apply-to-tier_(3;4"
);
```/docs/multi-sweater.jpg "with_image:false")

Original image

Color changes by dominance


## Sample app: AI-powered object recolor demo

This demo shows how visitors can upload an image and choose new colors for the objects detected in it.

The code for this app is available in [GitHub](https://github.com/cloudinary-devs/recolor-detected-objects).

## Limitations
* The generative recolor effect can only be used on non-transparent images.
* The use of generative AI means that results may not be 100% accurate.
* The generative recolor effect works best on simple objects that are clearly visible, and not abstract concepts such as "background".
* Very small objects and very large objects may not be detected.
* During processing, large images are downscaled to a maximum of 2048 x 2048 pixels, then upscaled back to their original size, which may affect quality.
* When you specify more than one prompt, all the objects specified in each of the prompts will be recolored whether or not `multiple_true` is specified in the URL.
* There is a [special transformation count](transformation_counts#special_effect_calculations) for the generative recolor effect.
* The generative recolor effect isn't supported for [animated](animated_images) images or [fetched](fetch_remote_images#fetch_and_deliver_remote_files) images.
* [User-defined variables](user_defined_variables) can't be used for the prompt when more than one prompt is specified.
* When Cloudinary is generating a derived version, you may get a 423 response returned until the version is ready. You can prepare derived versions in advance using an [eager transformation](eager_and_incoming_transformations#eager_transformations).
* When Cloudinary is generating an [incoming transformation](eager_and_incoming_transformations#incoming_transformations), you may get a 420 response returned, with status `pending` until the asset is ready.
* If you're using our [Asia Pacific data center](admin_api#alternative_data_centers_and_endpoints_premium_feature), you currently can't apply the generative recolor effect.