Expand description
M3 elevation shadows, painted with ColorRole::SHADOW.
Each level is the reference two-layer box shadow: a key layer at 30% and
an ambient layer at 15% of the shadow role. Reference priority is Figma
kit > md3.io > m3e.kyralabs.dev; the table is the Figma Material 3 Design
Kit’s local effect styles M3/Elevation Light/1-5 and
M3/Elevation Dark/1-5 (file key ozddDB2Z1v51f1IFZlUuJ2), which share
geometry and opacities in both themes and differ only in layer order.
Fixture: tests/fixtures/figma-sys-tokens.json. md3.io and m3e
(tests/fixtures/m3e-sys-tokens.json) agree.
| Level | Key (x/y/blur/spread @ 30%) | Ambient (x/y/blur/spread @ 15%) |
|---|---|---|
| 0 | none | none |
| 1 | 0/1/2/0 | 0/1/3/1 |
| 2 | 0/1/2/0 | 0/2/6/2 |
| 3 | 0/1/3/0 | 0/4/8/3 |
| 4 | 0/2/3/0 | 0/6/10/4 |
| 5 | 0/4/4/0 | 0/8/12/6 |
Constants§
- MAX_
LEVEL - The highest M3 elevation level.
Functions§
- layers
- Both layers of
level(clamped toMAX_LEVEL), key first. - level
- The shadow list of
level; level 0 paints no shadow. - level0
- M3 level 0: flat, no shadow.
- level1
- M3 level 1: elevated cards, elevated buttons at rest.
- level2
- M3 level 2: hovered elevated controls, menus.
- level3
- M3 level 3: snackbars, dialogs, FABs at rest.
- level4
- M3 level 4: hovered FABs.
- level5
- M3 level 5.