Edited at

Material UI の Shadow を完全にオフる方法(React)


はじめに

Button をオーバーライドして

shadow = 'none'

にしておけば、オフにできるかなと思ったけど

押下した時に現れる影は消せていないことが判明したので、ちょこっと付け加えることにした


押下前


押下時


解決

これだけ

none の付け方に注目


import {createMuiTheme, makeStyles} from '@material-ui/core/styles';
import {MuiThemeProvider} from "@material-ui/core";

const theme = createMuiTheme({
shadows: ["none"]
});

const Index = () => {
return(
<MuiThemeProvider theme={theme}>
<Button variant={valiant} className={classes.button}>
ボタンだよん
</Button>
</MuiThemeProvider>
)
}


最後に

「この画面では、俺はリプルエフェクトだけが欲しいんだ!!!影はいらん!!」

という方は試してみてくださいな