提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“图标旋转”(Icon Spin)悬停效果。
指针进入时，元素内的图标顺滑地转一整圈；指针离开时再转回去。
只旋转图标，不旋转整个按钮；键盘聚焦时也显示同样的效果。相似的动效
Spin (无限旋转)
别称 Rotate Loop, Spinner
元素以恒定速度持续旋转。
适用场景
加载转圈指示器
在[应用位置]添加“无限旋转”(Spin)效果，也叫 spinner 或 rotate loop。
元素要以恒定、均匀的速度持续旋转，每圈之间不要有缓动。
让循环无缝衔接，给 spinner 加上无障碍的“加载中”标签；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就放慢或停止旋转。A
将鼠标悬停在上面
悬停时元素旋转几度。
适用场景
图标、缩略图
在[应用位置]添加“旋转”(Rotate)悬停效果。
指针悬停时，元素顺时针轻微转动，指针离开后转回：顺滑而含蓄。
避免周围布局移位；键盘聚焦时也显示同样的效果。A
将鼠标悬停在上面
悬停时图标向下掉出视野，再从上方落回。
适用场景
图标按钮
在[应用位置]添加“图标下落”(Icon Drop)悬停效果。
元素内的图标向下掉出视野，再从上方落回原位：迅速，落地轻柔。
每次指针进入只播放一次，不要循环；标签和按钮尺寸保持不变。Hover 中的其他动效
AA
将鼠标悬停在上面
悬停时按钮文字滑出，箭头和填充色随之展开。
适用场景
CTA 按钮
在[应用位置]添加“交互悬停按钮”(Interactive Hover Button)效果。
文字旁的小圆点扩大直到填满按钮，同时文字向一侧滑出并淡出，带箭头的文字再从新填充色上方滑入：顺滑而迅速。
按钮尺寸保持固定，文字全程清晰可读；键盘聚焦时也显示同样的效果。将鼠标悬停在上面
Nudge Forward / Backward (前后轻推)
别称 Arrow nudge
悬停时箭头或元素本身向前或向后滑动几个像素。
适用场景
下一页/上一页链接、箭头
在[应用位置]添加“前后轻推”(Nudge Forward / Backward)悬停效果，也叫 arrow nudge。
指针悬停时，箭头朝它所指的方向轻轻滑动一小段，指针离开后滑回：快速、幅度小。
只移动箭头，不要让文字或布局跟着偏移；键盘聚焦时也显示同样的效果。A
将鼠标悬停在上面
悬停时轮廓线从元素向外扩展，或向元素收缩。
适用场景
按钮
在[应用位置]添加“轮廓扩展”(Outline Expand)悬停效果。
轮廓线起初紧贴元素边缘，随后向外扩展，在四周留出一小圈间隙，悬停期间保持不变，指针离开后再收回：顺滑而迅速。
绘制轮廓时不要改变元素尺寸，也不要挤动周围内容；键盘聚焦时也显示同样的效果。