エフェクト
foundation影と透明度の段階一覧です。シャドウは modal / ツールチップなど実際に最前面へ重なる一時レイヤー専用で、恒常的に画面に置く surface（カード等）の浮き上がり表現には使いません（区切りはボーダー + 背景色で示す）。
ドロップシャドウ
CSS: shadow-*
none / sm / md / lg の 4 段階＋focus-ring / destructive のリング用 2 種。
none
no shadow
sm
0 1 3 · 10%
md
2 layers · 5%
lg
2 layers · 5%
focus-ring
0 0 0 3 · info/600
destructive
0 0 0 3 · negative/500
opacity
CSS: opacity-*
0 から 100 まで 5% 刻みの 21 段階。市松模様の上に blue/600 を重ねて表示。
0
5
10
15
20
25
30
35
40
45
50
55
60
65
70
75
80
85
90
95
100