不存在叫 Composer 的通用平面设计软件能直接给“零件”加阴影;实际场景分三类:Photoshop图层样式、Figma组件阴影样式、3D引擎实时阴影,需先确认所用工具。

Composer 不是 Adobe Photoshop 的组件,也不是一个独立的图像处理软件——它没有“给零件添加阴影”的功能。如果你在搜索中看到“Composer 添加阴影”,大概率是混淆了以下三类工具之一:
-
Photoshop(常被误称为 “PS Composer” 或 “Adobe Composer”) -
Figma/Sketch等 UI 工具中的“组件(Component)”+ 阴影样式 - 某些 3D 渲染插件或 Unity/Unreal 中的
Shader Graph或Material Composer类节点编辑器
所以第一个关键判断是:不存在叫 Composer 的通用平面设计软件能直接给“零件”加阴影。你要做的,是先确认自己实际用的是什么工具。
Photoshop 中给图层/智能对象加动态阴影(最常见误搜场景)
很多用户把“用 PS 做产品图、UI 元件、带投影的按钮”说成“在 Composer 里加阴影”,其实是操作发生在 Photoshop。
- 动态 ≠ 实时动画,而是指随图层变换自动更新的投影效果,靠图层样式实现
- 必须确保目标图层是像素图层、文字图层、形状图层或智能对象;普通背景图层(锁住的
Background)无法直接加样式 - 关键参数不是随便填:
-
角度要统一(勾选使用全局光),否则多个元素阴影方向打架 -
距离和大小要匹配物体离地高度——比如按钮抬升 2px,距离设 2,大小设 4;产品图悬浮感强,距离可设 8–12,大小 10–16 -
不透明度别拉满,40%–60% 更自然;超过 70% 容易发灰、压背景
-
示例:给一个圆角矩形按钮加可信阴影
双击图层 → 勾选「投影」→ 混合模式:正片叠底,不透明度:52%,角度:120°,距离:3px,扩展:0%,大小:6px,勾选「使用全局光」
Figma 组件(Component)中设置可继承的阴影样式
如果你说的是 UI 设计中的“零件”(如 Button、Card 组件),那真正支持“动态阴影”的是 Figma 的组件变体(Variant)或样式系统。
- 阴影写在组件主实例上,所有实例自动同步;改一次,全项目更新
- 不支持“按状态自动切换阴影强度”,但可通过变体手动定义:
Default(阴影小)、Hover(阴影大+偏移微调)、Pressed(阴影压缩/消失) - 注意:Figma 的阴影是纯 CSS 式参数(
X,Y,Blur,Spread,Color),没有“全局光”概念,每个组件得单独对齐光源逻辑
容易踩的坑:
- 把阴影加在组件内部图层而非组件根节点 → 变体切换时阴影丢失
- 用布尔运算合并形状后加阴影 → 阴影只包络最终轮廓,无法表现结构层次
真实“动态”阴影:需要渲染引擎或代码控制(非 PS/Figma 场景)
如果你真在做交互式 3D、WebGL 或 AR 应用,“零件”指模型部件,阴影需实时计算:
-
Three.js中开启renderer.shadowMap.enabled = true,并为光源和物体分别设置castShadow/receiveShadow -
Unity里检查Light的Shadow Type(Hard/Soft),且模型 Mesh Renderer 要启用Receive Shadows - 这类阴影会随视角、光源移动实时变化,但代价是性能开销;导出静态图时反而要关掉,避免噪点
这类场景下,Composer 可能指 Unity 的 Shader Graph 或 Unreal 的 Material Editor,但它们不直接“加阴影”,而是构建接收/投射阴影的材质逻辑。
真实感提升的关键不在参数堆砌,而在光源一致性:
一个画面里如果出现左上、右下两个方向的阴影,人眼会立刻觉得假——哪怕每个阴影单独看都很柔和。先定主光源(通常 120° 或 315°),再让所有投影、高光、环境光都服从它。这点在 PS 里靠 使用全局光 强制对齐,在 Figma 里靠设计规范文档约束,在 3D 引擎里靠场景灯光布局。其他都是细节。











