Mode-aware semantic color groups attached to the MUI theme as theme.semantic and exposed as CSS custom properties by AppTheme.

interface SemanticColors {
    border: { default: string; subtle: string };
    surface: { card: string; elevated: string; page: string };
    text: { muted: string; primary: string; secondary: string };
}

Properties

Properties

border: { default: string; subtle: string }

Border colors.

Type declaration

  • default: string

    Default border (--border-default).

  • subtle: string

    Subtle border (--border-subtle).

surface: { card: string; elevated: string; page: string }

Background surface colors.

Type declaration

  • card: string

    Card background (--bg-card).

  • elevated: string

    Elevated surface, e.g. popovers (--bg-elevated).

  • page: string

    Page background (--bg-page).

text: { muted: string; primary: string; secondary: string }

Text colors.

Type declaration

  • muted: string

    Muted text (--text-muted).

  • primary: string

    Primary text (--text-primary).

  • secondary: string

    Secondary text (--text-secondary).