提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“文字倾斜”(Text Tilt)效果，也叫透视文字倾斜(perspective text tilt)。
文字随着指针移动平滑跟随，以 3D 方式轻轻朝指针倾斜，指针移开后再缓缓恢复平整。
倾斜幅度要含蓄，保证文字可读；在触屏设备上，以及如果用户开启了“减少动态效果”(prefers-reduced-motion)，文字保持平整不动。相似的动效
A
移动指针试试
3D Tilt (3D倾斜)
别称 Perspective tilt, 3D card effect, Tilt card, Tilt on hover, Parallax tilt
卡片朝指针方向透视旋转，分层内容从表面浮起。
适用场景
产品卡片和价格卡片
在[应用位置]添加“3D倾斜”(3D Tilt)效果，也叫 perspective tilt 或 tilt card。
指针移动时，卡片朝指针方向透视倾斜，内部各层以不同深度从表面浮起；指针移开后平滑地恢复平放：平滑而含蓄。
倾斜幅度要小，保证文字易读；在触屏设备上，以及用户开启了“减少动态效果”(prefers-reduced-motion)时，让卡片保持平放。ABC DEF GHI JKLABC DEF GHI JKL
MNO PQR STU VWXMNO PQR STU VWX
YZA BCD EFG HIJYZA BCD EFG HIJ
Kinetic Typography (动态排版)
别称 Kinetic Text
文字不再是静态文案，而是作为运动的图形元素缩放、移动或旋转。
适用场景
品牌首屏区块
在[应用位置]添加“动态排版”(Kinetic Typography)，也叫 kinetic text。
一行行重复的大号文字以缓慢、稳定的节奏交替朝相反方向横向滑动，让文字本身变成运动的图形。
每一行都要无缝循环、看不出跳接，屏幕阅读器只读一遍文字；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就停止运动。Text 中的其他动效
ABC DEFG
Typewriter (打字机)
别称 Typing Animation, Typewriter Effect, Typing Text
字符像打字一样逐个出现，通常后面跟着一个闪烁的光标。
适用场景
首屏大标题、标语
在[应用位置]添加“打字机”(Typewriter)效果，也叫打字动画(typing animation)或打字文字(typing text)。
字符以稳定的打字节奏逐个出现，最后一个已输入字符后面紧跟一个光标，打完后闪烁几次。
只播放一次、不要循环，让屏幕阅读器立即读到完整文本；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接显示完整文本。ABC DEF
将鼠标悬停在上面
Underline Draw (下划线绘制)
别称 Animated Underline, Hover Underline Animation, Underline Stretch, Underline Grow, Underline Slide, Underline From Left
悬停时，链接下方的下划线从一侧或中间延伸出来。
适用场景
导航链接、文内链接
在[应用位置]添加“下划线绘制”(Underline Draw)悬停效果，也叫动画下划线(animated underline)或悬停下划线动画(hover underline animation)。
指针停在链接上时，文字下方的下划线从左到右平滑延伸，指针移开后再收回：快速而含蓄。
不要让下划线挤动周围布局，并且在键盘聚焦时呈现同样的效果。ABCDEF
将鼠标悬停在上面
Variable Font Weight Animation (可变字重动画)
别称 Font Weight Shift, Breathe Variable Font Animation, Font Transition on Hover
借助可变字体的轴，字母平滑地变粗或变细（或改变宽度、倾斜度）。
适用场景
交互式标题
在[应用位置]添加“可变字重动画”(Variable Font Weight Animation)悬停效果，也叫字重切换(font weight shift)。
指针停在文字上时，字母从左到右依次变粗，形成一道流畅的波浪；指针移开后再变细。
使用可变字体，让字重平滑变化而不是跳变；标题变宽时不要挤动附近内容，并且在键盘聚焦时呈现同样的效果。