Shadow
Shadows provide cues about depth, direction of movement, and surface edges. A surface’s shadow is determined by its elevation and relationship to other surfaces.
Last updated
Shadows provide cues about depth, direction of movement, and surface edges. A surface’s shadow is determined by its elevation and relationship to other surfaces.
Last updated
Because shadows express the degree of elevation between surfaces, they must be used consistently throughout your product.
The soft shadow creates a more natural and clean feel to the interface. The default elevation value we use is 4px.
The opacity (12 - 20%) and the higher level of blur (32 - 40px) - This configuration builds a soft shadow for the light theme.
The opacity (32 - 40%) and the higher level of blur (32 - 44px) - This configuration builds a soft shadow for the dark theme.
