提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“斜切”(Skew)悬停效果。
指针停在元素上时，元素向一侧斜切成轻微倾斜的样子，移开后恢复端正：快速而流畅。
倾斜时文字仍要清晰可读，不要让周围的布局发生位移，键盘焦点时也显示同样的效果。相似的动效
A
将鼠标悬停在上面
悬停时元素旋转几度。
适用场景
图标、缩略图
在[应用位置]添加“旋转”(Rotate)悬停效果。
指针悬停时，元素顺时针轻微转动，指针离开后转回：顺滑而含蓄。
避免周围布局移位；键盘聚焦时也显示同样的效果。A
Jello (果冻)
别称 Jelly
元素像晃动的果冻一样来回倾斜变形，幅度逐渐减小。
适用场景
俏皮地强调按钮或 Logo
在[应用位置]添加“果冻”(Jello)提示效果，也叫 jelly。
元素要像晃动的果冻一样来回倾斜变形：一开始幅度大，然后很快平息下来。
触发时只播放一次，并保持元素占据的空间不变，避免周围内容移位。A
Light Speed In (光速进入)
别称 Lightspeed In
元素带着倾斜从侧面疾速冲入，落定时恢复端正。
适用场景
横幅或标题的戏剧性入场
在[应用位置]添加“光速进入”(Light Speed In)入场动画，也叫 lightspeed in。
元素像高速飞驰一样倾斜着从侧面疾速冲入，倾斜先反向过冲一次，落定时恢复端正：快速而有戏剧性，末尾减速。
元素还在屏幕外时不要产生横向滚动条；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示，不做动画。Hover 中的其他动效
A
将鼠标悬停在上面
Speech Bubble (对话气泡)
别称 Bubble
悬停时，元素一侧出现一个对话气泡的小三角。
适用场景
标签页、工具提示
在[应用位置]添加“对话气泡”(Speech Bubble)悬停效果，也叫气泡(bubble)。
一个小三角尾巴从元素一侧的后面滑出，让元素变成对话气泡的形状，指针移开后再滑回去：快速而流畅。
尾巴要和元素同色，看起来是一个整体，键盘焦点时也显示同样的效果。A
将鼠标悬停在上面
悬停时，元素边缘内侧出现一条内描边线。
适用场景
按钮、卡片
在[应用位置]添加“内描边”(Trim)悬停效果。
指针停在元素上时，一条细线在元素边缘内侧淡入，移开后淡出：含蓄，不带位移。
线条要放在元素内部，保持元素尺寸不变，键盘焦点时也显示同样的效果。ABC
将鼠标悬停在上面
Underline Reveal (下划线显现)
别称 Overline Reveal, Reveal
一条线从底边或顶边滑入到位，为元素加上下划线或上划线。
适用场景
导航链接、按钮
在[应用位置]添加“下划线显现”(Underline Reveal)悬停效果，也叫上划线显现(overline reveal)或显现(reveal)。
指针停在元素上时，一条通宽的线从底边正下方向上滑入到位，移开后再向下滑出视野：快速而流畅。
在边缘处裁剪线条，让它以滑入而不是淡入或伸长的方式出现，键盘焦点时也显示同样的效果。