Why do we use elevation?
We use elevation to create create a visual distinction between components and visual elements with different spatial relationships.
Each elevation level assigns a three-dimensional appearance to an object, using shadows and blurs to achieve it. The levels of elevation we have created help us differentiate the elevation within the Z-axis at which these components are placed.
Using elevations in your products
Here are some tips to keep in mind when using our elevation tokens:
Use elevation to help distinguish overlapping elements
For components which appear on top of other elements of the design, try using elevation to make them more visible.
Don’t overdo it
Using elevation consistently but sparingly will help your users understand the hierarchy and interaction patterns for the design elements in your product. Using too many elevation tokens in your designs will only empoverish the user’s experience.