| Variable name | Value | Original Value |
|---|---|---|
| Offset-x | ||
| $shadow-offset-x-xs | 4px | {spacer.unit.4} |
| $shadow-offset-x-sm | 8px | {spacer.unit.8} |
| $shadow-offset-x-md | 16px | {spacer.unit.16} |
| $shadow-offset-x-lg | 24px | {spacer.unit.24} |
| Offset-y | ||
| $shadow-offset-y-xs | 4px | {spacer.unit.4} |
| $shadow-offset-y-sm | 8px | {spacer.unit.8} |
| $shadow-offset-y-md | 16px | {spacer.unit.16} |
| $shadow-offset-y-lg | 24px | {spacer.unit.24} |
| Blur | ||
| $shadow-blur-xs | 4px | {spacer.unit.4} |
| $shadow-blur-sm | 8px | {spacer.unit.8} |
| $shadow-blur-md | 16px | {spacer.unit.16} |
| $shadow-blur-lg | 24px | {spacer.unit.24} |
| $shadow-blur-xl | 32px | {spacer.unit.32} |
| $shadow-blur-7xl | 64px | {spacer.unit.64} |
| Spread | ||
| $shadow-spread-xs | 4px | {spacer.unit.4} |
| $shadow-spread-sm | 8px | {spacer.unit.8} |
| $shadow-spread-md | 16px | {spacer.unit.16} |
| $shadow-spread-lg | 24px | {spacer.unit.24} |
| Variable name | Value | Original Value |
|---|---|---|
| $shadow-active | 0 0 16px 0 rgba(#003060,0.1) | 0 0 {shadow.parameters.blur.md} 0 rgba({color.brand.secondary.100},0.1) |
| $shadow-hover | 0 0 16px 0 rgba(#003060,0.15) | 0 0 {shadow.parameters.blur.md} 0 rgba({color.brand.secondary.100},0.15) |
| $shadow-sidebar | 0 0 32px 0 rgba(#003060,0.06) | 0 0 {shadow.parameters.blur.xl} 0 rgba({color.brand.secondary.100},0.06) |
| $shadow-detail | 0 16px 64px 0 rgba(#003060,0.24) | 0 {shadow.parameters.offset-y.md} {shadow.parameters.blur.7xl} 0 rgba({color.brand.secondary.100},0.24) |