提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“翻滚退出”(Roll Out)退场动画。
元素像轮子一样边转动边向右滚出，同时淡出：平滑，离开时加速。
等它完全滚走后再从布局中移除；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。相似的动效
A
元素绕一个支点旋转，同时淡出消失。
适用场景
条目的活泼移除
在[应用位置]添加“旋转退出”(Rotate Out)退场动画。
元素绕自身中心旋转略多于半圈，同时淡出：平滑，逐渐加速。
旋转结束后再移除；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。A
Slide Out (滑出)
别称 Slide Out Up, Slide Out Down
元素滑出容器边缘后消失。
适用场景
关闭抽屉和面板
在[应用位置]添加“滑出”(Slide Out)退场动画，也叫 slide out up 或 slide out down。
元素保持完全不透明，滑出容器边缘后消失：快速，离开时加速。
在容器边缘处裁切，移出视野后对键盘和屏幕阅读器也隐藏；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。A
元素像轮子一样从左侧滚入，同时淡入。
适用场景
列表项的活泼入场
在[应用位置]添加“翻滚进入”(Roll In)入场动画。
元素像轮子一样边转动边从左侧滚入，同时淡入：平滑，落定时减速。
只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。A
元素以左上角为铰链摆动、晃荡几下，然后掉出屏幕。
适用场景
以滑稽的方式移除元素
在[应用位置]添加“铰链掉落”(Hinge)退场动画。
元素像螺丝松脱一样以左上角为轴向下摆，来回晃荡，然后一边淡出一边掉出屏幕：缓慢、滑稽、刻意。
让它从其他内容上方掉落，不要挤动布局或产生滚动条，掉落后移除元素；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则立即隐藏。Entrance & Exit 中的其他动效
A
Rotate In (旋转进入)
别称 Rotate In Down Left
元素绕某个角或自身中心旋转进入，同时淡入。
适用场景
图标或卡片的活泼入场
在[应用位置]添加“旋转进入”(Rotate In)入场动画，也叫 rotate in down left。
元素从倾斜的角度出发，绕左下角旋转到位，同时淡入：平滑、从容，落定时逐渐减速。
只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。A
Slide In (滑入)
别称 Slide In Up, Slide In Down, Slide In Left, Slide In Right
元素从容器边缘之外滑入到停靠位置，不带淡入效果。
适用场景
抽屉、侧边栏、横幅
在[应用位置]添加“滑入”(Slide In)入场动画，也叫 slide in left、slide in right、slide in up 或 slide in down。
元素从容器边缘之外滑到停靠位置，全程保持完全不透明：快速，平滑减速，不要回弹。
在容器边缘处裁切，避免它在外面时遮住相邻元素或产生滚动条；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示。