Elevation tokens
Elevation tokens are used to give elements the appearance of being raised off the page. Use them with the box-shadow property. These are especially useful for menus, popovers, and dialogs.
| Token | Value | Example |
|---|---|---|
--gr-shadow-x-small |
0 1px 0 #0d131e0d |
|
--gr-shadow-small |
0 1px 2px #0d131e1a |
|
--gr-shadow-medium |
0 2px 4px #0d131e1a |
|
--gr-shadow-large |
0 2px 8px #0d131e1a |
|
--gr-shadow-x-large |
0 4px 16px #0d131e1a |