{
primaryColor: "#7e3bd0",
primaryTextColor: "#ffffff",
/**
* Body Style Keys
*/
bodyBackgroundColor: "#f5f7f7",
bodyGridColor: "rgba(221, 221, 221, 0.5)",
// Sidebar Sticky Panel Style
stickyPanelBackgroundColor: "#7e3bd0",
stickyPanelBackgroundColorInActive: "#fff",
stickyPanelTextColor: "rgba(255, 255, 255, 0.7)",
stickyPanelTextColorInHover: "#ffffff",
stickyPanelTextColorInActive: "#7e3bd0",
stickyPanelDividerColor: "rgba(255, 255, 255, 0.2)",
/**
* Main Sidebar Style Keys
*/
sidebarBackgroundColor: "#fff",
sidebarBorderColor: "#f5f7f7",
sidebarTitleColor: "#1e4148",
sidebarTitleBorderColor: "#ebefef",
/**
* Element Configuration Sidebar Style Keys
*/
sidebarHeaderBackgroundColor: "#6c2fb9",
sidebarHeaderTextColor: "#ffffff",
sidebarHeaderTabBackgroundColor: "#7e3bd0",
sidebarHeaderTabTextColor: "#ffffff",
// Active state Keys
sidebarHeaderTabBackgroundColorInActive: "#6c2fb9",
sidebarHeaderTabTextColorInActive: "#ffffff",
// Toggle Style Keys
sidebarHeaderToggleTextColor: "#ebefef",
sidebarHeaderToggleTextColorInHover: "#ffffff",
// Vertical Toggle Style Keys
sidebarVerticalToggleColor: "#C0CACC",
sidebarVerticalToggleColorInHover: "#1E4148",
// Tabs Style Keys
sidebarHeaderTabsBackgroundColor: "#7e3bd0",
sidebarHeaderTabsItemTextColor: "#ffffff",
sidebarHeaderTabsItemBackgroundColor: "transparent",
sidebarHeaderTabsItemTextColorInActive: "#ffffff",
sidebarHeaderTabsItemBackgroundColorInActive: "#8e42eb",
/**
* Sidebar Elements Style
*/
sidebarElementCardBackgroundColor: "#f1f5f9",
sidebarElementCardTextColor: "#305056",
sidebarElementCardBorderColor: "#cbd5e1",
// HOVER State
sidebarElementCardBackgroundColorInHover: "#f1f5f9",
sidebarElementCardTextColorInHover: "#305056",
sidebarElementCardBorderColorInHover: "#e2e8f0",
/**
* Layout Column Style Keys
*/
columnsBackgroundColor: "#cbd5e1",
columnsTextColorInHover: "#ffffff",
columnsBackgroundColorInHover: "#7e3bd0",
columnsBackgroundColorInActive: "#7e3bd0",
columnsBackgroundColorInInactive: "#cbd5e1",
/**
* Input Style Keys
*/
inputLabelColor: "#64748b",
inputBackgroundColor: "#f1f5f9",
inputTextColor: "#4b686d",
inputBorderColor: "#f1f5f9",
inputBackgroundColorInHover: "#f1f5f9",
inputTextColorInHover: "#4b686d",
inputBorderColorInHover: "",
inputBackgroundColorInDisabled: "#f1f5f9",
inputTextColorInDisabled: "#4b686d",
inputBorderColorInDisabled: "#f1f5f9",
inputPlaceholderColor: "#94a3b8",
inputInvalidColor: "#ef4444",
inputDividerColor: "#d7dddf",
inputWheelerColor: "#ccd5df",
// Clear Button Style Keys
inputClearButtonTextColor: "#95A6A8",
inputClearButtonTextColorInHover: "#1E4148",
// Control Button Style Keys
inputControlButtonTextColor: "#4B686D",
inputControlButtonBackgroundColor: "#ffffff",
inputControlButtonTextColorInHover: "#1E4148",
inputControlButtonBackgroundColorInHover: "#DEE4E4",
inputControlButtonDividerColor: "#EBEFEF",
// Range Input Color
rangeInputColor: "rgba(30,41,59,.1)",
// Color Input Style Keys
colorPickerBackgroundColor: "#ffffff",
colorPalettesBorderColor: "#C0CACC",
// Checkbox Input Style Keys
checkboxBorderColor: "#dee4e4",
checkboxBackgroundColor: "transparent",
checkboxTextColor: "#1e4148",
checkboxBorderColorInHover: "#dee4e4",
checkboxBackgroundColorInHover: "transparent",
checkboxTextColorInHover: "#1e4148",
checkboxBorderColorInActive: "#7e3bd0",
checkboxBackgroundColorInActive: "transparent",
checkboxTextColorInActive: "#7e3bd0",
// Grid Input Style Keys
gridInputInHover: "#7e3bd0",
gridInputInActive: "#7e3bd0",
/**
* Drag Style Keys
*/
dragHandlerColor: "#022A31",
/**
* Device Style Keys
*/
deviceControlGroupBackgroundColor: "#ffffff",
deviceControlTextColor: "#1E4148",
deviceControlTextColorInHover: "#34d399",
deviceControlTextColorInActive: "#34d399",
// With Input
inputDeviceControlTextColor: "#3C5B60",
inputDeviceControlTextColorInHover: "#34d399",
inputDeviceControlTextColorInActive: "#34d399",
/**
* Tabs Style Keys
*/
// Bottom border Line Tab Style Keys
bottomLineTabsBackgroundColor: "#ffffff",
bottomLineTabsItemTextColor: "#1E4148",
bottomLineTabsItemBorderColor: "#f5f7f7",
bottomLineTabsItemBorderColorInActive: "#7e3bd0",
// Button Group Tab Style Keys
buttonGroupTabsItemTextColor: "#B1BDBF",
buttonGroupTabsItemBackgroundColor: "#f1f5f9",
buttonGroupTabsItemTextColorInActive: "#7e3bd0",
// Radio Button Group Tab Style Keys
radioButtonGroupTabsItemTextColor: "#B1BDBF",
radioButtonGroupTabsItemBackgroundColor: "#f1f5f9",
radioButtonGroupTabsCircleColor: "#DEE4E4",
radioButtonGroupTabsItemTextColorInActive: "#7e3bd0",
radioButtonGroupTabsCircleColorInActive: "#7e3bd0",
// Base Tabs Style Keys
tabsBackgroundColor: "#f1f5f9",
tabsItemTextColor: "#B1BDBF",
tabsItemBorderColor: "#ffffff",
tabsItemTextColorInActive: "#7e3bd0",
tabsItemBackgroundColorInActive: "#e2e8f0",
// Input Tabs Style Keys
inputTabsBackgroundColor: "#f1f5f9",
inputTabsItemTextColor: "#B1BDBF",
inputTabsItemBackgroundColor: "transparent",
inputTabsItemTextColorInActive: "#7e3bd0",
inputTabsItemBackgroundColorInActive: "#e2e8f0",
/**
* Compatibility Alert Style Keys
*/
compatibilityAlertBackgroundColor: "transparent",
compatibilityAlertBorderColor: "#e2e8f0",
compatibilityAlertIconColor: "#f87171",
compatibilityAlertTitleColor: "#292524",
compatibilityAlertTextColor: "#292524",
/**
* Empty Message Style Keys
*/
emptyMessageTextColor: "rgb(220, 230, 241)",
emptyMessageIconColor: "rgb(149, 166, 168, 0.6)",
/**
* Message Box Style Keys
*/
messageBoxBackgroundColor: "rgba(245, 245, 245, 0.85)",
messageBoxTextColor: "#000",
/**
* Accordion Style Keys
*/
accordionBackgroundColor: "#f1f5f9",
accordionTextColor: "#1E4148",
accordionBackgroundColorInHover: "#e2e8f0",
accordionTextColorInHover: "#1E4148",
// Bottom Line Accordion Style Keys
lineAccordionBorderColor: "#F5F7F7",
lineAccordionTextColor: "#a3b0c2",
lineAccordionTextColorInHover: "#a3b0c2",
lineAccordionTextColorInActive: "#7e3bd0",
/**
* Columns Style Keys
*/
columnPropertyBorderColor: "#F5F7F7",
columnPropertyBorderColorInActive: "#7e3bd0",
/**
* Vertical, Horizontal Alignment Property Style Keys
*/
alignmentTextColor: "#becbcc",
alignmentTextColorInHover: "#95A6A8",
alignmentTextColorInActive: "#7e3bd0",
/**
* Lock Property Style Keys
*/
lockPropertyTextColor: "#1E4148",
lockPropertyTextColorInHover: "#1E4148",
lockPropertyTextColorInActive: "#7e3bd0",
// Small Size Lock
smallLockPropertyTextColor: "#95A6A8",
smallLockPropertyTextColorInHover: "#95A6A8",
smallLockPropertyTextColorInActive: "#7e3bd0",
// Button Type Lock
buttonLockPropertyBackgroundColor: "#f1f5f9",
buttonLockPropertyTextColor: "#95A6A8",
buttonLockPropertyBackgroundColorInHover: "#f1f5f9",
buttonLockPropertyTextColorInHover: "#95A6A8",
buttonLockPropertyBackgroundColorInActive: "transparent",
buttonLockPropertyTextColorInActive: "#95A6A8",
/**
* Quick Preview Style Keys
*/
quickPreviewLayer1BackgroundColor: "#f1f5f9",
quickPreviewLayer2BackgroundColor: "#ffffff",
quickPreviewLayer3BackgroundColor: "#e5f4ff",
quickPreviewLayer4BackgroundColor: "#ffffff",
quickPreviewBorderColor: "#1E4148",
quickPreviewTextColor: "#1E4148",
/**
* Buttons Style Keys
*/
// Add Button Style Keys
addButtonTextColor: "#768C90",
addButtonIconBackgroundColor: "#94a3b8",
addButtonIconTextColor: "#ffffff",
addButtonTextColorInHover: "#768C90",
addButtonIconBackgroundColorInHover: "#7e3bd0",
addButtonIconTextColorInHover: "#ffffff",
// Icon Button Style Keys
iconButtonTextColor: "#95A6A8",
iconButtonTextColorInHover: "#1E4148",
iconButtonTextColorInActive: "#7e3bd0",
// Primary Button Style Keys
primaryButtonTextColor: "#ffffff",
primaryButtonBackgroundColor: "#7e3bd0",
primaryButtonTextColorInHover: "#ffffff",
primaryButtonBackgroundColorInHover: "#6c2fb9",
// Secondary Button Style Keys
secondaryButtonTextColor: "#1E4148",
secondaryButtonBackgroundColor: "#ffffff",
secondaryButtonBorderColor: "#EBEFEF",
secondaryButtonTextColorInHover: "#1E4148",
secondaryButtonBackgroundColorInHover: "#F5F7F7",
secondaryButtonBorderColorInHover: "#EBEFEF",
/**
* Top Customize Bar Style Keys
*/
topToolbarBackgroundColor: "#ffffff",
topToolbarButtonDividerColor: "#EBEFEF",
// Button Style Keys
topToolbarButtonBackgroundColor: "transparent",
topToolbarButtonTextColor: "#1E4148",
topToolbarButtonBackgroundColorInHover: "#f1f5f9",
topToolbarButtonTextColorInHover: "#1E4148",
topToolbarButtonBackgroundColorInActive: "#f1f5f9",
topToolbarButtonTextColorInActive: "#1E4148",
// Outline Button Style Keys
topToolbarOutlineButtonBackgroundColor: "transparent",
topToolbarOutlineButtonBorderColor: "#f1f5f9",
topToolbarOutlineButtonTextColor: "#1E4148",
topToolbarOutlineButtonBackgroundColorInHover: "#f1f5f9",
topToolbarOutlineButtonBorderColorInHover: "#f1f5f9",
topToolbarOutlineButtonTextColorInHover: "#1E4148",
topToolbarOutlineButtonBackgroundColorInActive: "#f1f5f9",
topToolbarOutlineButtonBorderColorInActive: "#f1f5f9",
topToolbarOutlineButtonTextColorInActive: "#1E4148",
/**
* Dropdown Menu Style Keys
*/
dropdownMenuBackgroundColor: "#ffffff",
dropdownMenuBorderColor: "#DEE4E4",
dropdownMenuGroupTitleColor: "#B1BDBF",
dropdownMenuLinkBackgroundColor: "transparent",
dropdownMenuLinkIconColor: "#7e3bd0",
dropdownMenuLinkTextColor: "#1E4148",
dropdownMenuLinkBackgroundColorInHover: "#F5F7F7",
dropdownMenuLinkIconColorInHover: "#7e3bd0",
dropdownMenuLinkTextColorInHover: "#7e3bd0",
dropdownMenuLinkBackgroundColorInActive: "transparent",
dropdownMenuLinkIconColorInActive: "#7e3bd0",
dropdownMenuLinkTextColorInActive: "#7e3bd0",
dropdownMenuLinkCheckColor: "#34d399",
dropdownMenuDividerColor: "#EBEFEF",
/**
* Modal Style Keys
*/
modalBodyBackgroundColor: "#ffffff",
modalBackdropColor: "rgba(28,38,55,0.5)",
modalDividerColor: "#EBEFEF",
modalTitleColor: "#1E4148",
modalTextColor: "#1E4148",
// Toggle Style Keys
modalToggleBackgroundColor: "rgba(239,68,68,0.25)",
modalToggleBorderColor: "rgba(239,68,68,0.25)",
modalToggleTextColor: "#dc2626",
modalToggleBackgroundColorInHover: "rgba(239,68,68,0.25)",
modalToggleBorderColorInHover: "rgba(239,68,68,0.25)",
modalToggleTextColorInHover: "#dc2626",
/**
* Tooltip Style Keys
*/
tooltipBackgroundColor: "rgba(51, 65, 85, 0.95)",
tooltipTextColor: "#ffffff",
/**
* Uploader Style Keys
*/
uploaderBackgroundColor: "transparent",
uploaderBorderColor: "#f7f7ff",
uploaderTitleColor: "#4b556a",
uploaderTextColor: "#929498",
uploaderBackgroundColorInHover: "transparent",
uploaderBorderColorInHover: "#f7f7ff",
uploaderTitleColorInHover: "#4b556a",
uploaderTextColorInHover: "#929498",
uploaderDragIndicatorBackgroundColor: "#eceef3",
uploaderDragIndicatorTextColor: "#7a7b7d",
/**
* Layout Tree Style Keys
*/
layoutTreeBackgroundColor: "#ffffff",
layoutTreeItemBackgroundColor: "#F5F7F7",
layoutTreeItemTextColor: "#1E4148",
layoutTreeItemArrowColor: "#F5F7F7",
layoutTreeItemBackgroundColorInHover: "#F5F7F7",
layoutTreeItemBackgroundColorInActive: "#7e3bd0",
}