提示词
将 [应用位置] 替换为你要应用的位置,然后粘贴给 AI 智能体。提示词中包含动效名称,下次只说名称即可提出需求。
在[应用位置]添加“文字替换”(Text Replacement)效果,也叫文字切换(text swap)。
文字变化时,旧字符向上滑出,新字符从下方滑入,逐个字符形成快速而流畅的波动。
切换过程中不要让文本框尺寸跳动,并且只向屏幕阅读器播报新文本。相似的动效
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),则停止轮播。ABCDEFGHI
Morphing Text (文字变形)
别称 Text Morph
一个词在同一位置模糊并融合成下一个词。
适用场景
首屏标语
在[应用位置]添加“文字变形”(Morphing Text)效果,也叫 text morph。
一个词在同一位置变模糊,以柔和、黏稠的方式融合成下一个词,然后停留片刻再进行下一次切换。
词语之间无缝循环,让屏幕阅读器把这些词当作普通文字读出;如果用户开启了“减少动态效果”(prefers-reduced-motion),就停止循环。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)。
指针移到文字上时,每个字母快速闪过随机字符,再从左到右依次定格为真实字母。
乱码过程中文字宽度不要跳动,让屏幕阅读器始终读取真实文本,并且在键盘聚焦时呈现同样的效果。ABCD EFGHI JKLM
Mask Reveal (遮罩显现)
别称 Line Mask Reveal, Split Text Overflow Hidden Reveal, Text Masking
文字从一条裁切线后方向上滑出,仿佛凭空出现。
适用场景
编辑风格的大标题
在[应用位置]添加“遮罩显现”(Mask Reveal)文字入场效果,也叫行遮罩显现(line mask reveal)或文字遮罩(text masking)。
每一行文字从一条看不见的边缘后方向上滑出,仿佛凭空出现,一行接一行,快速顺滑,不要有弹跳感。
文字滚动进入视口时只播放一次;如果用户开启了“减少动态效果”(prefers-reduced-motion),则直接显示文字,不做动画。Text 中的其他动效
ABCDEFGHIJKLMNOPQRSTUVWXYZ
在里面滚动
Text Reveal (文字显现)
别称 Scroll Text Reveal, Word-by-word Reveal
随着用户滚动,段落中的文字从暗淡变为完全不透明。
适用场景
宣言或引言段落
在[应用位置]添加“文字显现”(Text Reveal)效果,也叫滚动文字显现(scroll text reveal)或逐词显现(word-by-word reveal)。
段落起初是暗淡的,随着用户滚动,每个词依次亮到完全清晰,与滚动位置绑定。
向上滚回时文字重新变暗;无论暗淡程度如何,整段文字都要始终能被屏幕阅读器读取。ABCDEFGHIJKL
移动指针试试
Text Reveal Card (文字显现卡片)
别称 Spotlight Text Reveal
在卡片上移动指针时,遮罩边缘或聚光灯下隐藏的文字随之显露。
适用场景
功能卡片
在[应用位置]添加“文字显现卡片”(Text Reveal Card)效果,也叫聚光灯文字显现(spotlight text reveal)。
指针在卡片上移动时,一条竖直边缘紧紧跟随,在一侧露出隐藏的文字:流畅、直接,没有延迟。
在没有指针可跟随的触屏设备上,让拖动或点按也能显示隐藏文字,并让隐藏文字可被屏幕阅读器读取。