Elevation
Elevation defines how elements interact with other spatially and creates opportunities for rich layering of content and intuitive interactions.
Shadow
Shadows can be used to visually define a component from its surrounding and establish its spatial relationship within the overall layout.
There are four levels of shadow available to allow for a variety of spatial relationships within a given layout.
Z-index
Z-index is used to set the layer order of elements. This is critical for elements and components that visually "sit on top" of others within a view such as a dialog and its overlay or a slide-out drawer. While properly setting the z-index ensures certain components are not obscured, it does not necessarily establish the perceived visual depth between surfaces that shadow does.
Values are available from 0 to 1000 in increments of 100. A value of -100 is available when elements need to be positioned below the base level of 0.