React Material-UI Cookbook

How it works...

When the palette.type theme value changes from light to dark, the following palette values change:

• palette.text
• palette.divider
• palette.background
• palette.action

Let's take a look at the two themes used in this example:

const light = createMuiTheme({  palette: {    type: 'light',    primary: blue,    secondary: pink,    error: { main: red[600] }  }});const dark = createMuiTheme({  palette: {    type: 'dark',    primary: blue,    secondary: pink,    error: { main: red[600] }  }});

These two themes are the same except for the palette.type value. Whenever you change this value, new color values are computed for the theme. For example, the new text color that you see in the dialog isn't static—it's a color that's computed by Material-UI in order to provide ...