Elevation

Shadows and elevation as Sass mixins and CSS classes.

MK Elevation is an SCSS mixin that allows you to set the color of components’ box-shadows through variables.

// default values are rgba(0, 0, 0, .12)
$mk-elevation-umbra-color: rgba(67, 72, 77, .12);
$mk-elevation-penumbra-color: rgba(67, 72, 77, .12);
$mk-elevation-ambient-color: rgba(67, 72, 77, .12);

@import "material-components-kit/components/elevation/elevation";

For the rest, elevation’s usage in Material Components Kit is the same as in MDC Web.

Learn more about MDC Elevation.