---
title: "applyProductTheme Method"
canonical: https://customerscanvas.com/docs/cc6/customerscanvas.iframeapi.objectmodel.product.applyproducttheme.htm
archived: true
applies_to:
  - product: "Customer's Canvas On-Premises"
  - product: "Design Editor"
    versions: ["6.15.0", "6.x (may differ)"]
---

**You’re viewing outdated documentation.** [View the latest Customer’s Canvas On-Premises documentation](https://customerscanvas.com/docs/on-premises/).

# applyProductTheme Method

**Applies to:** Customer's Canvas On-Premises; Design Editor 6.15.0, 6.x (may differ) · **Archived documentation**
 
### Callable
 
- applyProductTheme(theme:  string  |  [IProductThemeConfig](https://customerscanvas.com/docs/cc6/customerscanvas.iframeapi.configuration.iproductthemeconfig.htm.md) ) :  Promise < void >

- Applies a color theme to the product. For details, see the [Product Themes](https://customerscanvas.com/docs/cc6/product-themes.htm.md) topic.
  
 - example
     - ```
    // Define a color theme.
    var productTheme = {
        "violet": {
            "C01": "rgb(102,45,145)",
            "C02": "rgb(150,67,214)",
            "C03": "rgb(190,107,255)",
            "C04": "rgb(32,18,77)"
        }
    };
    
    // Enable the violet theme.
    CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition,
        { productThemes: productTheme, defaultProductTheme: "violet" })
        // If the editor has been successfully loaded.
        .then(function (editor) {
            // Change the color theme.
            editor.applyProductTheme({
                "C01": "rgb(241,160,175)",
                "C02": "rgb(255,200,214)",
                "C03": "rgb(255,255,255)",
                "C04": "rgb(224,102,102)"
            });
        })
        // If there was an error thrown when loading the editor.
        .catch(function (error) {
            console.error("The editor failed to load with an exception: ", error);
        });
    ```

#### Parameters

    - ##### theme: string  |  [IProductThemeConfig](https://customerscanvas.com/docs/cc6/customerscanvas.iframeapi.configuration.iproductthemeconfig.htm.md) 
  
        A name of a color theme defined for the current product or through the `clientConfig.json` file.

#### Returns Promise < void >