提示词
将 [应用位置] 替换为你要应用的位置,然后粘贴给 AI 智能体。提示词中包含动效名称,下次只说名称即可提出需求。
在[应用位置]添加“故障文字”(Glitch Text)悬停效果,也叫 text glitch 或 RGB 分离故障(RGB split glitch)。
指针停在文字上时,文字以快速、利落的阵发方式抖动:细细的横向切片左右跳动,两份彩色副本像信号故障一样错开;指针移开后恢复原状。
真实文字在文档中只保留一份,避免屏幕阅读器读出副本;键盘聚焦时也显示同样的效果。相似的动效
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)。
指针移到文字上时,每个字母快速闪过随机字符,再从左到右依次定格为真实字母。
乱码过程中文字宽度不要跳动,让屏幕阅读器始终读取真实文本,并且在键盘聚焦时呈现同样的效果。ABC
Flicker (频闪)
别称 Flickering
元素的不透明度像接触不良的灯一样不规则地闪动。
适用场景
霓虹和故障风效果
在[应用位置]添加“频闪”(Flicker)效果,也叫 flickering。
元素大部分时间保持稳定,偶尔像接触不良的霓虹灯一样短促、不均匀地变暗。
节奏要不规则而不是等间隔,避免全强度的快速闪烁;对开启了“减少动态效果”的用户则停止。ABCABCABC
在里面滚动
Sliced Text (切片文字)
别称 On-Scroll Sliced Text
标题被切成若干水平切片,页面滚动时切片彼此错开、横向移动。
适用场景
编辑风格的首屏
在[应用位置]添加“切片文字”(Sliced Text)效果,也叫 on-scroll sliced 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),就停止动画。Text 中的其他动效
ABCDEF
将鼠标悬停在上面
Holographic Text (全息文字)
别称 Holographic Foil Text
文字呈现流转的彩虹箔片反光,随指针或时间移动。
适用场景
高级感卡片
在[应用位置]添加“全息文字”(Holographic Text)悬停效果,也叫全息箔片文字(holographic foil text)。
指针停在文字上时,一道箔片般的彩色光带在字母上缓慢、顺滑地来回滑动;指针移开后,文字恢复原本的朴素样子。
光泽流动的任何时刻文字都要清晰可读;键盘聚焦时也显示同样的效果。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),就停止运动。ABCDEF
将鼠标悬停在上面
Letter Scatter (文字飞散)
别称 Explosive Letter Burst, Scatter Gather Letters
悬停时字母四散飞开再归位,或在入场时向外迸散。
适用场景
俏皮的链接
在[应用位置]添加“文字飞散”(Letter Scatter)悬停效果,也叫 scatter gather letters 或 explosive letter burst。
指针移到文字上时,每个字母带着一点旋转朝各自方向飞出一小段;指针移开后再顺滑地聚拢回原来的单词。
字母移动时,单词在布局中占的位置保持不变,屏幕阅读器要把它当作一个词来读;键盘聚焦时也显示同样的效果。