提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“遮罩显现”(Mask Reveal)文字入场效果，也叫行遮罩显现(line mask reveal)或文字遮罩(text masking)。
每一行文字从一条看不见的边缘后方向上滑出，仿佛凭空出现，一行接一行，快速顺滑，不要有弹跳感。
文字滚动进入视口时只播放一次；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接显示文字，不做动画。相似的动效
ABCDEF
Split Text Stagger (拆分文字交错)
别称 Letter Stagger, Staggered Text Reveal, SplitText, Splitting.js text
标题被拆分成字符、单词或行，以短暂延迟依次动画入场。
适用场景
大标题、章节标题
在[应用位置]添加“拆分文字交错”(Split Text Stagger)入场效果，也叫逐字交错(letter stagger)或 staggered text reveal。
把标题拆成单个字母，字母之间留出短暂延迟，依次上移并淡入，快速顺滑，不要有弹跳感。
标题进入视口时只播放一次，让屏幕阅读器把它当作一个完整的词读出；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接显示，不做动画。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)，则直接完整显示。ABDEFGHIJKLDEFMN
Word Rotate (词语轮播)
别称 Rotating Words, Flip Words, Container Text Flip, Layout Text Flip, Rotating Text Wheel
句子中的一个词以滑动、翻转或淡入淡出的方式换成列表中的下一个词。
适用场景
首屏标语
在[应用位置]添加“词语轮播”(Word Rotate)效果，也叫轮换词(rotating words)或翻转词(flip words)。
行内的一个词向上滑出，列表中的下一个词从下方滑入，每个词停留片刻后再切换。
词宽不同时不要让这一行的其余部分跳动，不要让屏幕阅读器播报每次切换；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止轮播。AWBXCYDZ
Text Replacement (文字替换)
别称 Text Swap
原有文字以动画方式退出，并被新的文字内容替换。
适用场景
会变化的标签
在[应用位置]添加“文字替换”(Text Replacement)效果，也叫文字切换(text swap)。
文字变化时，旧字符向上滑出，新字符从下方滑入，逐个字符形成快速而流畅的波动。
切换过程中不要让文本框尺寸跳动，并且只向屏幕阅读器播报新文本。Text 中的其他动效
Q
R
U
P
D
H
LY
O
S
G
K
X
BA
F
J
Z
V
M
EH
L
C
N
W
T
IX
B
Q
R
U
P
DM
E
Y
O
S
G
KT
I
A
F
J
Z
VP
D
H
L
C
N
W
Matrix Text (数字雨文字)
别称 Digital Rain Text
绿色字符像《黑客帝国》里的代码雨一样成列落下。
适用场景
黑客主题
在[应用位置]添加“数字雨文字”(Matrix Text)效果，也叫 digital rain text。
一列列字符以略有差异的速度稳定落下，每列最前面的字符明亮，后面拖着逐渐淡去的尾迹。
把它当作对屏幕阅读器隐藏的装饰，保持轻量；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就停止动画。ABCDEF
字母向下滴落、拉长，仿佛正在融化。
适用场景
恐怖或趣味标题
在[应用位置]添加“融化文字”(Melting Text)效果。
字母缓慢向下塌陷，下方拉出滴落的液滴，仿佛正在融化，最后停在静止的融化形态。
文字进入视口时只播放一次，结束时保持文字可读；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则不做动画。ABCDEFGHI
Morphing Text (文字变形)
别称 Text Morph
一个词在同一位置模糊并融合成下一个词。
适用场景
首屏标语
在[应用位置]添加“文字变形”(Morphing Text)效果，也叫 text morph。
一个词在同一位置变模糊，以柔和、黏稠的方式融合成下一个词，然后停留片刻再进行下一次切换。
词语之间无缝循环，让屏幕阅读器把这些词当作普通文字读出；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就停止循环。