Uses
Drop shadows are used sparingly throughout the School of Medicine site. The main place the user will encounter a drop shadow is on cards or box elements. The use of drop shadows is typically discouraged except in these places as drop shadows can distract users from the content if not implemented correctly.
Styles
Drop shadows should always be a light gray color and should also always have some blurring. The typical drop shadow on the School of Medicine site uses the following style: 0 2px 5px 0 rgba(0,0,0,0.13). The 0 represents the shadow is moved 0 px in the left and right axis. The 2px means the shadows is moved 2px downwards. The 5px represents a blurring of the shadow by 5px. Finally the 0px represents a scaling amount of the shadow. The 0,0,0 represents the rgb color of the shadow (in this case, black), while the 0.13 represents the opacity of the shadow (in this case 13%).
Examples
The card above shows how a slight drop shadow is used to make the card appear raised from the foreground elements. The shadow is subtle