React Material-UI Cookbook

How it works...

The Blue theme applies the color palette theme settings, while the Rounded theme changes the borderRadius settings. Both themes are applied to the Dialog component—you can see the blue primary button, and the round corners are even more round. Let's take a closer look at the Rounded theme:

const Rounded = theme =>  createMuiTheme({    ...theme,    shape: {      borderRadius: 8    }  });

Instead of being an object, Rounded is a function that returns a theme object. When you pass a function to the theme property of MuiThemeProvider, a theme argument is passed. This is the outer theme, or, in this example, the Blue theme. The theme is extended by applying the spread operator to the theme argument, and then passing additional theme values to ...