---
title: "IThemeSection Interface"
canonical: https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.ithemesection.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/).

# IThemeSection Interface

**Applies to:** Customer's Canvas On-Premises; Design Editor 6.15.0, 6.x (may differ) · **Archived documentation**
 
A structure defining the section of theme colors in the **Color picker**. For details, see the [Color Picker](https://customerscanvas.com/docs/cc6/colors.htm.md) and [Product Themes](https://customerscanvas.com/docs/cc6/product-themes.htm.md).
  
 - example
     - ```
let colorSets = {
    "violetSet": {
        "main": "rgb(102,45,145)",
        "alternative": "rgb(150,67,214)",
        "borders": "rgb(190,107,255)",
        "texts": "rgb(32,18,77)",
        "shadows": "rgb(123,123,123)"
    },
    "roseSet": {
        "main": "rgb(241,160,175)",
        "alternative": "rgb(255,200,214)",
        "borders": "rgb(255,255,255)",
        "texts": "rgb(224,102,102)",
        "shadows": "rgb(88,88,88)"
    },
};
let configuration = {
    productThemes: colorSets,
    defaultProductTheme: "roseSet",
    widgets: {
        ColorPicker: {
            sections: [
              {
                  type: "ThemeSection"
              }
            ]
        }
    }
};
```
 
## Properties
 
### Optional targets
 
targets: [ColorPickerTarget](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.colorpickertarget.htm.md) []

Inherited from [IColorPickerConfigSection](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md).[targets](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md)

An item property that you can specify a color for. The default value is `["All"]`.
 
### Optional translationKey
 
translationKey: string

Inherited from [IColorPickerConfigSection](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md).[translationKey](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md)

The section name. You can use either a string or an identifier of a string defined in the `~\Configuration\translations.json ` file.
 
### type
 
type: [ThemeSection](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.sectiontype.htm.md)

Overwrites [IColorPickerConfigSection](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md).[type](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md)

The source type, `"ThemeSection"`.
 
### Optional viewType
 
viewType: [ColorPickerSectionViewType](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.colorpickersectionviewtype.htm.md)

Inherited from [IColorPickerConfigSection](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md).[viewType](https://customerscanvas.com/docs/cc6/customerscanvas.baseeditor.configuration.ui.icolorpickerconfigsection.htm.md)

The appearance of the section, either `"Block"` or `"Line"`. The default value is `"Block"`.