提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“漩涡”(Vortex)背景，也叫 swirling particles。
小粒子像漩涡一样绕着中心点螺旋向内旋转，在边缘淡入，接近中心时淡出，形成流畅、连续的旋涡。
粒子数量要适中；离开屏幕时暂停；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止旋转。相似的动效
Particles (粒子)
别称 Floating particles, Particle field
大量小圆点在背景中漂浮、相互连接或对指针作出反应。
适用场景
首屏和区块背景
在[应用位置]添加“粒子”(Particles)背景，也叫 floating particles 或 particle field。
大小不一的小圆点各按自己的节奏，沿着柔和、随意游走的路径缓慢漂浮：平静而轻盈。
圆点数量要适中，在性能较弱的设备上也保持轻快；离开屏幕时暂停；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止动画。A
Orbiting Circles (环绕轨道)
别称 Orbit Animation, Orbit, Orbiting icons
小圆点或图标沿圆形轨道绕中心旋转。
适用场景
集成关系图
在[应用位置]添加“环绕轨道”(Orbiting Circles)，也叫 orbit animation 或 orbiting icons。
小圆点沿圆形轨道缓慢、匀速地绕中心元素旋转，外圈则以更慢的速度反向旋转。
循环要无缝，环绕的元素始终保持正立；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止旋转。Background & Ambient 中的其他动效
Wave Background (波浪背景)
别称 Wavy background, Animated waves
多层波浪线条或形状沿水平方向起伏流动。
适用场景
区块分隔、首屏底部
在[应用位置]添加“波浪背景”(Wave Background)，也叫 wavy background 或 animated waves。
几层波浪形状以略有不同的速度横向滚动，彼此交叠、像水一样流动：缓慢而平滑。
让每层波浪无缝循环、看不到跳动；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就让波浪静止。A
B
Animated Beam (动态光束)
别称 Connecting beam
一道发光脉冲沿着连接两个元素的线条移动。
适用场景
集成关系图或数据流图
在[应用位置]添加“动态光束”(Animated Beam)效果，也叫 connecting beam。
一道短促的发光脉冲沿着连接两个元素的线条从一端匀速移动到另一端，然后重新开始：流畅、平静。
连接线本身要始终可见；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则让脉冲保持静止。Animated Gradient (动态渐变)
别称 Gradient animation, Moving gradient, Background gradient animation
渐变背景中的颜色缓慢变化、平移或旋转。
适用场景
首屏背景、按钮
在[应用位置]添加“动态渐变”(Animated Gradient)背景，也叫 gradient animation 或 moving gradient。
渐变的颜色在区域内缓慢平移，柔和、连续地流动，循环重新开始时不能出现可见的跳动。
上方的文字在每种颜色上都要清晰可读；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止移动。