Foundation
Depth & Shadow
z-index and shadow effect tokens
Overview
Tokens that define the sense of depth and shadow effects for UI elements.
Depth (z-index)
13 tokens
| Token | Value |
|---|---|
Blur
1 tokens
| Token | Value |
|---|---|
Stroke
1 tokens
| Token | Value |
|---|---|
Usage
import { tokens, styles } from '@illog/themes'
// z-index
tokens.size.depth[400] // 16
// Shadow
<Box shadow="300">Dropdown shadow</Box>
// Using drop shadow styles directly
styles.dropShadow[300]
// → Multiple layered box-shadow values