Shadow
We use shadows to provide cues about depth, direction of movement and surface edges.
| Token | Value | Example |
|---|---|---|
shadowElevate | 0 8px 12px -4px var(--colorShadowDepth) | |
shadowElevateLoud | 0 2px 8px -6px var(--colorShadowDepthLoud) | |
shadowElevateQuiet | 0 8px 12px -4px var(--colorShadowDepthQuiet) | |
shadowRaise | 0 6px 24px 0 var(--colorShadowDepth) | |
shadowRaiseQuiet | 0 3px 12px 0 var(--colorShadowDepth) |