applyStyles
applyStyles: ApplyStyles<"light" | "dark">
breakpoints
breakpoints: Breakpoints
Optionalcomponents
components?: Components<BaseTheme>
containerQueries
containerQueries: (name: string) => ContainerQueries & ContainerQueries
OptionalcssVariables
cssVariables?: false
Optionalcustom
custom?: Record<string, any>
direction
direction: Direction
GUI
GUI: { [key: string]: unknown }
Optionalinsets
insets?: Partial<Insets>
layout
layout: { insets: Insets }
transitions
transitions: Transitions
typography
typography: Typography
Optionalunstable_strictMode
unstable_strictMode?: boolean
unstable_sx
unstable_sx: (props: SxProps<MuiTheme>) => CSSObject unstable_sxConfig
unstable_sxConfig: SxConfig
OptionalupdateInsets
updateInsets?: (next: Partial<Insets>, source?: string) => void
visuals
visuals: {
accents: {
aurora: {
chip:
| "primary"
| "secondary"
| "success"
| "warning"
| "error"
| "info"
| "default";
soft: string;
strong: string;
};
ember: {
chip: | "primary"
| "secondary"
| "success"
| "warning"
| "error"
| "info"
| "default";
soft: string;
strong: string;
};
monolith: {
chip: | "primary"
| "secondary"
| "success"
| "warning"
| "error"
| "info"
| "default";
soft: string;
strong: string;
};
};
}
Our TypeScript guide on theme customization explains in detail how you would add custom properties.