IItemData Interface

A structure defining text parameters that you can change through product themes.

IItemData contains only optional parameters. When you do not specify them in a product theme, then corresponding properites remain unchanged in your product template.

// Define a color set.
var elementStyles = {
    "Classic": {
        "Shapes": {
            "color": "rgb(1,10,9)",
            "borderColor": "rgb(7,70,63)",
            "fillColor": "rgb(9,90,81)"
        "Headers": { 
            "color": "rgb(185,90,155)", 
            "underline": true,
            "font": {
                "postScriptName": "Calibri",
                "size": 20,
                "fauxBold": true,
                "fauxItalic": false

// Set up the theme for your product.
var configuration = {
    productThemes: elementStyles,
    defaultProductTheme: "Classic"

// Load the editor.
CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition, configuration);


Optional borderColor

borderColor: string

The border color for design elements.

Optional borderWidth

borderWidth: number

The border width for design elements.

Optional color

color: string

The color in a CSS-compatible format.

Optional fillColor

fillColor: string

The fill color for shapes.

Optional font

The font settings.

Optional leading

leading: number

The text leading, in points.

Optional opacity

opacity: number

The opacity of design elements.

Optional tracking

tracking: number

The text tracking, in points.

Optional underline

underline: boolean

Whether the text is underlined.