提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“弹跳退出”(Bounce Out)退场动画。
元素先轻轻下沉，再略微胀大超过原尺寸，然后一边缩小一边淡出：短促、有弹性。
等动画结束后再将它从布局中移除；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。相似的动效
A
元素缩小并滑向一侧边缘，同时淡出。
适用场景
关闭卡片
在[应用位置]添加“回弹退出”(Back Out)退场动画。
元素先在原地稍微缩小，再滑向一侧边缘并淡出：一个刻意的两段式退场，而不是一次快速淡出。
等动画结束后再移除元素，避免布局在动画中途跳动；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即移除。A
Zoom Out (缩放退出)
别称 Scale Out
元素缩小并淡出，直至消失。
适用场景
关闭模态框和移除条目
在[应用位置]添加“缩放退出”(Zoom Out)退场动画，也叫 scale out。
元素朝中心缩小并淡出，直至消失：快速，逐渐加速。
完全消失后再从布局和键盘焦点中移除；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。A
Bounce In (弹跳进入)
别称 Bounce In Down, Bounce In Up
元素以超出后回落的弹跳方式进入，可以是放大出现，也可以从边缘落下。
适用场景
通知徽标、活泼的弹窗
在[应用位置]添加“弹跳进入”(Bounce In)入场动画，也叫 bounce in down 或 bounce in up。
元素从小逐渐放大，略微超过完整尺寸后晃动几下再稳定下来：迅速、有弹性。
只播放一次，以免持续抢夺注意力；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。Entrance & Exit 中的其他动效
A
Clip Reveal (裁剪显现)
别称 Image Reveal, Mask Reveal, Clip-path Reveal, Wipe Reveal
clip-path 或遮罩从边缘或某一点展开，逐步露出图片或文字。
适用场景
图片和标题的显现
在[应用位置]添加“裁剪显现”(Clip Reveal)入场效果，也叫 mask reveal、wipe reveal 或 image reveal。
让裁剪边缘从左向右扫过，内容保持不动、逐步显露出来：流畅，开始和结束都要柔和。
从一开始就为元素预留空间，避免布局移动；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接完整显示。A
Fade In / Fade Out (淡入淡出)
别称 Fade
元素在原位从完全透明变为完全不透明，离开时则反过来。
适用场景
弹窗、轻提示和页面内容的出现
在[应用位置]添加“淡入淡出”(Fade In / Fade Out)动画，也叫 fade。
元素出现时在原位从完全透明变为完全可见，离开时以同样方式淡出：柔和，不要位移或缩放。
淡出后要确保它无法再被点击或通过键盘聚焦；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则瞬间切换。A
Fade In Directional (方向淡入)
别称 Fade In Down, Fade In Left, Fade In Right
元素从一侧移动一小段距离到最终位置，同时淡入。
适用场景
加载或滚动时出现的区块和卡片
在[应用位置]添加“方向淡入”(Fade In Directional)入场动画，也叫 fade in left、fade in right 或 fade in down。
元素从一侧移动一小段距离到最终位置，同时淡入：迅速流畅，到位时减速，不要弹跳。
只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。