1 | initial version |
To apply the main color in a MUI theme, you can use the palette.primary.main
property.
Here's an example of how to set the main color to blue:
import { createMuiTheme } from '@material-ui/core/styles';
const theme = createMuiTheme({
palette: {
primary: {
main: '#2196f3',
},
},
});
Once you have created the theme, you can use it in your application by wrapping it around your components with the ThemeProvider
component.
import React from 'react';
import { ThemeProvider } from '@material-ui/core/styles';
import { Button } from '@material-ui/core';
const App = () => {
return (
<ThemeProvider theme={theme}>
<Button variant="contained" color="primary">
Click me!
</Button>
</ThemeProvider>
);
};
This will create a blue button with the main color set to #2196f3
. You can apply the main color to other components in a similar way.