提示词
将 [应用位置] 替换为你要应用的位置，然后粘贴给 AI 智能体。提示词中包含动效名称，下次只说名称即可提出需求。
在[应用位置]添加“文字显现”(Text Reveal)效果，也叫滚动文字显现(scroll text reveal)或逐词显现(word-by-word reveal)。
段落起初是暗淡的，随着用户滚动，每个词依次亮到完全清晰，与滚动位置绑定。
向上滚回时文字重新变暗；无论暗淡程度如何，整段文字都要始终能被屏幕阅读器读取。相似的动效
ABCDEFGHIJKLMNOPQRSTUVWX
Text Generate (文字生成)
别称 Text Generate Effect
页面加载时，文字逐个淡入，常伴随模糊逐渐消散，仿佛正在生成。
适用场景
AI 风格的开场文案
在[应用位置]添加“文字生成”(Text Generate)效果。
文字逐个淡入，同时每个词上的柔和模糊逐渐消散，仿佛文本正在生成：节奏平稳、沉静。
页面加载时只播放一次，让屏幕阅读器立即读到完整文本；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接显示，不做动画。ABC DEFGHI JKLMNO PQR
在里面滚动
Sticky Text Fade (吸顶文字淡入淡出)
别称 Sticky Scroll Text Opacity Fade
文字固定不动，各行随滚动进度淡入淡出。
适用场景
滚动叙事
在[应用位置]添加“吸顶文字淡入淡出”(Sticky Text Fade)效果，也叫 sticky scroll text opacity fade。
该区块滚动期间，文字块固定在原位，各行随滚动进度逐行淡入淡出。
让淡入淡出直接跟随滚动位置，往回滚动时随之反转；无论透明度如何，每一行都要能被屏幕阅读器读到。A
在里面滚动
Scroll-Linked Animation (滚动驱动动画)
别称 Scroll-Driven Animation, Scroll Scrub, Scroll Timeline Animation, Scrub, Scroll Scrubbing, Scroll Progress Timeline, scroll() timeline, View Progress Timeline, view() timeline, Element Visibility Animation
动画进度直接绑定滚动位置，向前滚动时播放，向回滚动时倒放。
适用场景
叙事型页面、进度效果
在[应用位置]添加“滚动驱动动画”(Scroll-Linked Animation)，也叫 scroll-driven animation 或滚动擦洗(scroll scrub)。
动画要严格跟随滚动位置：向下滚动时正向播放，向上滚动时当场倒放，自身不带基于时间的缓动。
把整段动画映射到一个明确的滚动区间；如果用户开启了“减少动态效果”(prefers-reduced-motion)，就显示一个合理的静态状态。A
E
I
MB
F
J
NC
G
K
OD
H
L
PQ
R
S
T
在里面滚动
Scrolling Letters (滚动字母)
别称 On-Scroll Letter Animations
用户滚动经过各个章节时，标题的字母依次变换或移动。
适用场景
章节指示
在[应用位置]添加“滚动字母”(Scrolling Letters)效果，也叫 on-scroll letter animations。
用户滚动经过各章节时，标题的字母从左到右依次滚动到下一个字符，并直接跟随滚动位置变化。
向上滚回时字母要滚回原样，屏幕阅读器要以普通文字获取当前标题。Text 中的其他动效
ABCDEFGHIJKL
移动指针试试
Text Reveal Card (文字显现卡片)
别称 Spotlight Text Reveal
在卡片上移动指针时，遮罩边缘或聚光灯下隐藏的文字随之显露。
适用场景
功能卡片
在[应用位置]添加“文字显现卡片”(Text Reveal Card)效果，也叫聚光灯文字显现(spotlight text reveal)。
指针在卡片上移动时，一条竖直边缘紧紧跟随，在一侧露出隐藏的文字：流畅、直接，没有延迟。
在没有指针可跟随的触屏设备上，让拖动或点按也能显示隐藏文字，并让隐藏文字可被屏幕阅读器读取。A
Q
J
P
N
V
Y
HB
K
M
L
Z
W
T
XC
R
G
Q
J
P
N
VD
Y
H
K
M
L
Z
WE
T
X
R
G
Q
J
PF
N
V
Y
H
K
M
L
将鼠标悬停在上面
Text Scramble (文字乱码解码)
别称 ScrambleText, Text Decode, Encrypted Text, Text Unscramble, Hyper Text
文字被不断刷新的随机字符替代，并逐渐还原成最终的词。
适用场景
科技风首屏标题、链接悬停
在[应用位置]添加“文字乱码解码”(Text Scramble)悬停效果，也叫文字解码(text decode)或加密文字(encrypted text)。
指针移到文字上时，每个字母快速闪过随机字符，再从左到右依次定格为真实字母。
乱码过程中文字宽度不要跳动，让屏幕阅读器始终读取真实文本，并且在键盘聚焦时呈现同样的效果。ABCDEF
移动指针试试
Text Tilt (文字倾斜)
别称 Perspective Text Tilt
文字跟随鼠标位置以 3D 透视方式倾斜转动。
适用场景
首屏标题
在[应用位置]添加“文字倾斜”(Text Tilt)效果，也叫透视文字倾斜(perspective text tilt)。
文字随着指针移动平滑跟随，以 3D 方式轻轻朝指针倾斜，指针移开后再缓缓恢复平整。
倾斜幅度要含蓄，保证文字可读；在触屏设备上，以及如果用户开启了“减少动态效果”(prefers-reduced-motion)，文字保持平整不动。