Shadow

Reference scale for the elevation levels between UI elements on an interface.
Shadows Scale
The Shadow scale features a combination of 5 different elevation levels. Areas with larger shadows increase the proiminence of the element, whilst those at lower elevations have smaller shadows.
None
XS
S
M
L
XL
Shadows Classes and Variables
Shadow
Class
CSS Variable
None
.shadow-none
--shadow-none
XS
.shadow-xs
--shadow-xs
S
.shadow-s
--shadow-s
M
.shadow-m
--shadow-m
L
.shadow-l
--shadow-l
XL
.shadow-xl
--shadow-xl
Click here to see your activities