画布底色:
投影目标实体
拖动右侧控制面板,直观体验虚实边缘与景深跃迁
高度隐喻:中层悬浮
边缘虚化宽度 (Penumbra)
柔和
20 px
高斯衰减过渡带,形成柔软半影
矢量位移与投影距离
中度悬浮
10.0 px
模拟物体距离背景层高度约 4~8mm
光源入射方位角
斜上方
90° (垂直正下)
偏角决定了视觉重心与光线来源感知
阴影核心几何参数
0px
-100px (偏左)
0px (居中)
+100px (偏右)
10px
-100px (偏上)
0px
+100px (下落)
20px
0px (完全硬边)
20px (柔和)
100px (极限弥散)
0px
-50px (内缩)
0px (等比)
+50px (外延膨胀)
内阴影模式 (Inset)
反转投影至实体内部,呈现凹陷/内嵌立体感
色彩与透明度
40%
快捷色:
卡片形态调整
16px
256px
生成 CSS 规则
box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.4);