Skip to content
v2.273.0

WorkspaceThemeProperty Struct ​

Contains theme configuration for a workspace, supporting both light and dark modes.

Example ​

ts
// The code below shows an example of how to instantiate this type.
// The values are placeholders you should change.
import { aws_connect as connect } from 'aws-cdk-lib';
const workspaceThemeProperty: connect.CfnWorkspace.WorkspaceThemeProperty = {
  dark: {
    palette: {
      canvas: {
        activeBackground: 'activeBackground',
        containerBackground: 'containerBackground',
        pageBackground: 'pageBackground',
      },
      header: {
        background: 'background',
        invertActionsColors: false,
        text: 'text',
        textHover: 'textHover',
      },
      navigation: {
        background: 'background',
        invertActionsColors: false,
        text: 'text',
        textActive: 'textActive',
        textBackgroundActive: 'textBackgroundActive',
        textBackgroundHover: 'textBackgroundHover',
        textHover: 'textHover',
      },
      primary: {
        active: 'active',
        contrastText: 'contrastText',
        default: 'default',
      },
    },
    typography: {
      fontFamily: {
        default: 'default',
      },
    },
  },
  light: {
    palette: {
      canvas: {
        activeBackground: 'activeBackground',
        containerBackground: 'containerBackground',
        pageBackground: 'pageBackground',
      },
      header: {
        background: 'background',
        invertActionsColors: false,
        text: 'text',
        textHover: 'textHover',
      },
      navigation: {
        background: 'background',
        invertActionsColors: false,
        text: 'text',
        textActive: 'textActive',
        textBackgroundActive: 'textBackgroundActive',
        textBackgroundHover: 'textBackgroundHover',
        textHover: 'textHover',
      },
      primary: {
        active: 'active',
        contrastText: 'contrastText',
        default: 'default',
      },
    },
    typography: {
      fontFamily: {
        default: 'default',
      },
    },
  },
};

Properties ​

The theme configuration for dark mode.
The theme configuration for light mode.