---
title: "Interface: IUiConfig | Customer's Canvas On-Premises"
canonical: "https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig/"
---

# Interface: IUiConfig

> The basic structure for [IConfiguration](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IConfiguration.md), defines the editor settings.

## Extended by

- [`IConfiguration`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IConfiguration.md)

## Properties

### defaultLanguage?

> `optional` **defaultLanguage?**: `string`

A default interface language. The default value is `"en"`. For details, see the [Localization https://customerscanvas.com/dev/editors/iframe-api/customization/localization.html\|Localization](https://customerscanvas.com/dev/editors/iframe-api/customization/localization.html) topic.

***

### canvas?

> `optional` **canvas?**: [`ICanvasConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.ICanvasConfig.md)

A structure containing canvas settings.

***

### grid?

> `optional` **grid?**: [`IGridConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IGridConfig.md)

The grid configuration. For details, see the  [Grid https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/rulers-grids-snaplines.html\|Grid](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/rulers-grids-snaplines.html) topic.

***

### watermark?

> `optional` **watermark?**: [`IWatermarkConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IWatermarkConfig.md)

The watermark configuration.

***

### alignToSafetyLineName?

> `optional` **alignToSafetyLineName?**: `string`

A name of a safety line to which an item will be aligned; if there is no safety line with the name, then the item will be aligned to the first safety line in the safety lines array. The default value is `"bleed"`.

***

### initialMode?

> `optional` **initialMode?**: [`ModelModeType`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/types/ConfigurationTypes.ModelMode.ModelModeType.md)

The initial mode of the editor, either `"Simple"` or `"Advanced"`. The default value is `"Simple"`.

***

### canvasOnlyMode?

> `optional` **canvasOnlyMode?**: `boolean`

The edit mode allowing you to hide all interface elements but the canvas. The default value is `false`.

***

### loadUserInfoButtonEnabled?

> `optional` **loadUserInfoButtonEnabled?**: `boolean`

Displays the **Load my info** button. The default value is `false`. For details, see the [Populating designs with user info](https://customerscanvas.com/dev/editors/iframe-api/howto/user-info.html) topic.

***

### autoLoadUserInfo?

> `optional` **autoLoadUserInfo?**: `boolean`

If `true`, then a product is automatically populated with predefined data when it is loaded into the editor; the **Load my info** button is not displayed. The default value is `false`. For details, see the [Populating designs with user info](https://customerscanvas.com/dev/editors/iframe-api/howto/user-info.html) topic.

***

### imageEditorEnabled?

> `optional` **imageEditorEnabled?**: `boolean`

Enables the Image Editor. The default value is `true`.

***

### deleteItemConfirmationEnabled?

> `optional` **deleteItemConfirmationEnabled?**: `boolean`

Enables the confirmation dialog when deleting an item from a product. The default value is `false`.

***

### revertProductConfirmationEnabled?

> `optional` **revertProductConfirmationEnabled?**: `boolean`

Enables the confirmation dialog when reverting a product to its initial state. The default value is `true`.

***

### restoreProductOnReloadEnabled?

> `optional` **restoreProductOnReloadEnabled?**: `boolean`

Enables restoring a product state when the design page is reloaded in the browser; if `false`, the product is reverted on reloading. The default value is `false`.

***

### spellCheckEnabled?

> `optional` **spellCheckEnabled?**: `boolean`

Enables spell checking for product text fields and for the Rich text dialog. The default value is `false`.

***

### variableItemsMaskSymbol?

> `optional` **variableItemsMaskSymbol?**: `string`

A symbol marking design elements as variable items. By default, it is `"%"`.

***

### fontList?

> `optional` **fontList?**: `string`[] \| \{ `appFonts?`: `string`[]; \}

A list of fonts available for a user in the editor; all these fonts should be uploaded to the font folder on server, by default it is `~/Fonts/`. For details, see the [Font list](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/font-list.html) topic.

***

### fontListMode?

> `optional` **fontListMode?**: [`FontListModeType`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/types/ConfigurationTypes.FontListMode.FontListModeType.md)

A mode of the font list, either `"Simple"` or `"Advanced"`. The simple mode allows a user to select font and set font size; the advanced mode also provides an ability to change font style. The default value is `"Advanced"`.

***

### defaultItemsConfig?

> `optional` **defaultItemsConfig?**: [`IDefaultItemsConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IDefaultItemsConfig.md)

The configuration of design elements being added to a product. For details, see the [Toolbox https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/toolbox.html\|Toolbox](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/toolbox.html) topic.

***

### widgets?

> `optional` **widgets?**: [`IWidgetsConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/WidgetConfigurationInterfaces.IWidgetsConfig.md)

The configuration of the editor widgets. For details, see the [UI overview](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/ui-overview.html) topic.

***

### userInfo?

> `optional` **userInfo?**: `object`

Data to populate the loaded product template with.

#### Index Signature

\[`key`: `string`\]: `string` \| [`IBarcodeData`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/Barcode.IBarcodeData.md)

***

### perSurfaceConfiguration?

> `optional` **perSurfaceConfiguration?**: `IPerSurfaceConfiguration`

A configuration of widgets, that is defined for separate surfaces.

***

### productThemes?

> `optional` **productThemes?**: `object`

A predefined set of color themes and text styles for the product.

#### Index Signature

\[`name`: `string`\]: `IProductThemeConfig`

***

### defaultProductTheme?

> `optional` **defaultProductTheme?**: `string`

Allows for specifying the default color theme.

***

### assetSources?

> `optional` **assetSources?**: `IAssetSources`

Asset sources defined for the [Asset Manager](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/image-manager.html).

***

### enableTrace?

> `optional` **enableTrace?**: `boolean`

***

### themeConfiguration?

> `optional` **themeConfiguration?**: [`IThemeConfiguration`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IThemeConfiguration.md)

Defines the primary theme color and a new image for the standard preloader.

***

### variableTokens?

> `optional` **variableTokens?**: [`VariableToken`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.VariableToken.md)[]

A list of tokens available for insertion into text via a drop-down button in the Top toolbar, shown only while a user is editing text. If not set, the button is hidden.