Skip to main content

Shadows

Various Elevations​

Low​

The lowest elevation possible, used to give a slight sense of depth above the page. Use the shadow--lw class to achieve this effect.

Low Elevation

<div class="item shadow--lw">Low Elevation</div>

Medium​

A medium elevation, used in dropdowns and mobile navigation. Use the shadow--md class to achieve this effect.

Medium Elevation

<div class="item shadow--md">Medium Elevation</div>

Tall​

The tallest elevation possible, used in modals. Use the shadow--tl class to achieve this effect.

Tall Elevation

<div class="item shadow--tl">Tall Elevation</div>