Hard Shadows
xs · 2px
sm · 4px
md · 6px
lg · 8px
xl · 12px
pink
violet
lime
Spacing Scale
1
4
2
8
3
12
4
16
5
24
6
32
7
48
8
64
Borders & Radii
Border width
2
3
4
6
Radius
0
4
8
14
Z-Index & Motion
Page
Base
0
Dropdown
--z-dropdown
200
Tooltip
--z-tooltip
500
Modal
--z-modal
1000
Toast
--z-toast
2000
--transition-lifttransform var(--dur-fast) var(--ease-snap), box-shadow var(--dur-fast) var(--ease-snap)
--dur-fast90ms
--dur-base150ms
--ease-snapcubic-bezier(0.2, 0.9, 0.3, 1.3) — slight overshoot