# Shadows ### Mui core shadows We used core shadows as provided by MUI. Refer: ### Customized `customShadows` There are few shadows that we customized as per theme's need. check here: `src\themes\shadows.tsx`. **Demo**: ### How to use 1. Import MUI theme 2. Use shadow with an element.

import {useTheme} from '@mui/material/style';

function YourComponent() {
 const theme = useTheme();

 return (
  <>
   ...
   ...
    // normal shadow
    <Box sx={{ boxShadow: theme.customShadows.z1 }}>....</Box>

    // shadows according to palette
    <Box sx={{ boxShadow: theme.customShadows.primary }}>....</Box>
   ...
   ...
  </>
 )
}