I want to remove the shadows for all contained buttons in my custom MUI theme but I don't know how to go about it so far. How do I do so? I have tried setting the boxShadow property for each individual Button to Zero but that's not working.
I want to remove the shadows for all contained buttons in my custom MUI theme but I don't know how to go about it so far. How do I do so? I have tried setting the boxShadow property for each individual Button to Zero but that's not working.
You could use a Button prop named disableElevation (which is false by default)
You could use it per component or set globally in theme setting
In a single component
<Button variant="contained" disableElevation={true}>
a button
</Button>
Globally via theme setting
const theme = createTheme({
components: {
MuiButton: {
defaultProps: {
disableElevation: true
}
}
}
});
Codesandbox demo