提示词
将 [应用位置] 替换为你要应用的位置,然后粘贴给 AI 智能体。提示词中包含动效名称,下次只说名称即可提出需求。
在[应用位置]添加“频闪进入”(Flicker In)入场动画。
元素像故障的霓虹灯一样,以不规则的间隔亮灭几次后保持点亮:干脆的闪烁,没有位移。
只播放一次,闪烁次数要少、速度不能太快,确保对光敏感的人也安全;如果用户开启了“减少动态效果”(prefers-reduced-motion),则直接以常亮状态显示。相似的动效
ABC
Flicker (频闪)
别称 Flickering
元素的不透明度像接触不良的灯一样不规则地闪动。
适用场景
霓虹和故障风效果
在[应用位置]添加“频闪”(Flicker)效果,也叫 flickering。
元素大部分时间保持稳定,偶尔像接触不良的霓虹灯一样短促、不均匀地变暗。
节奏要不规则而不是等间隔,避免全强度的快速闪烁;对开启了“减少动态效果”的用户则停止。Flash (闪烁)
别称 Blink
元素通过快速切换不透明度来闪烁。
适用场景
提示有新内容
在[应用位置]添加“闪烁”(Flash)提示效果,也叫 blink。
元素快速淡出再淡入,闪烁两次,然后保持完全可见。
只播放一次,不要无休止地闪烁;快速闪烁可能让人不适,所以对开启了“减少动态效果”的用户则跳过。ABCDEF
Neon Glow Text (霓虹发光文字)
别称 Neon Sign Flicker, Glowing Text
文字像霓虹灯管一样发光,并闪烁或脉动。
适用场景
夜生活、游戏主题
在[应用位置]添加“霓虹发光文字”(Neon Glow Text)效果,也叫霓虹招牌闪烁(neon sign flicker)或发光文字(glowing text)。
文字像霓虹灯管一样发出柔和、稳定的光,偶尔像真实招牌那样短暂熄灭一下。
闪烁要偶尔出现而不是快速连闪,因为快速闪光可能伤害部分用户;如果用户开启了“减少动态效果”(prefers-reduced-motion),就保持稳定发光。A
Fade In / Fade Out (淡入淡出)
别称 Fade
元素在原位从完全透明变为完全不透明,离开时则反过来。
适用场景
弹窗、轻提示和页面内容的出现
在[应用位置]添加“淡入淡出”(Fade In / Fade Out)动画,也叫 fade。
元素出现时在原位从完全透明变为完全可见,离开时以同样方式淡出:柔和,不要位移或缩放。
淡出后要确保它无法再被点击或通过键盘聚焦;如果用户开启了“减少动态效果”(prefers-reduced-motion),则瞬间切换。Entrance & Exit 中的其他动效
A
元素绕 Y 轴旋转一整圈,同时稍微靠近观看者再退回。
适用场景
吸引注意地展示卡片或徽标
在[应用位置]添加“翻转”(Flip)动画。
元素绕竖直轴旋转一整圈,同时稍微靠近观看者,然后尺寸微微一缩再回到原位:活泼但简短。
加上透视(perspective)让旋转有纵深感,只播放一次、不要循环;如果用户开启了“减少动态效果”(prefers-reduced-motion),则省略旋转。A
Flip In (翻转进入)
别称 Flip In X, Flip In Y
元素绕水平轴或垂直轴做 3D 旋转,从侧面朝向转为正对观看者。
适用场景
卡片和磁贴的显现
在[应用位置]添加“翻转进入”(Flip In)入场动画,也叫 flip in X 或 flip in Y。
元素从侧面朝向开始,绕水平轴旋转到正对观看者,略微转过头再回来后稳定:迅速,带一点晃动。
加上透视(perspective)让旋转有纵深感;如果用户开启了“减少动态效果”(prefers-reduced-motion),则直接以正面状态显示,不做动画。A
Flip Out (翻转退出)
别称 Flip Out X, Flip Out Y
元素做 3D 旋转,直到侧面朝向、看不见为止。
适用场景
移除卡片和磁贴
在[应用位置]添加“翻转退出”(Flip Out)退场动画,也叫 flip out X 或 flip out Y。
元素先稍微向后倾斜,再绕竖直轴旋转到侧面朝向并消失:迅速、干脆。
加上透视(perspective)让旋转有纵深感,等旋转结束后再移除元素;如果用户开启了“减少动态效果”(prefers-reduced-motion),则立即隐藏。