Skip to content


Use these shorthand utilities for quickly configuring the position of an element.


z-index tooltip
z-index modal
<Box sx={{ zIndex: 'tooltip' }}>
<Box sx={{ zIndex: 'modal' }}>


import { positions } from '@mui/system';
Import name Prop CSS property Theme key
position position position none
zIndex zIndex z-index zIndex
top top top none
right right right none
bottom bottom bottom none
left left left none