Elevation
Globals
Bottom
Token name / Figma path
Value
$elevation-bottom-100/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 1
spread: 0
blur: 2
opacity: 0.12
$elevation-bottom-200/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 2
spread: -1
blur: 8
opacity: 0.08
$elevation-bottom-300/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 8
spread: -2
blur: 16
opacity: 0.12
$elevation-bottom-400/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: 16
spread: -6
blur: 24
opacity: 0.16
Top
Token name / Figma path
Value
$elevation-top-100/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -1
spread: 0
blur: 2
opacity: 0.12
$elevation-top-200/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -2
spread: -1
blur: 8
opacity: 0.08
$elevation-top-300/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -8
spread: -2
blur: 16
opacity: 0.12
$elevation-top-400/* 1st shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -2
spread: -1
blur: 2
opacity: 0.04
/* 2nd shadow */
color: $color-semantic-neutral--4
offsetX: 0
offsetY: -16
spread: -6
blur: 24
opacity: 0.16