提示詞
將 [套用位置] 替換成你要套用的位置，再貼給 AI 代理。提示詞中包含動效名稱，下次只要說出名稱就能提出需求。
在[套用位置]加入「翻牌文字」(Split-Flap Text) 效果，也叫翻牌看板 (text flipping board 或 flip board)。
每個字元格快速翻過字母表，直到停在目標字母上，各字元格從左到右依序停穩。
每次文字出現或變化時執行一次，只向螢幕閱讀器朗讀最終文字；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就不翻動、直接顯示最終文字。相似的動效
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9,0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
90
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
90
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
Odometer (里程表數字)
別稱 Rolling Numbers, Animated Number, AnimateNumber, Slot-Machine Digits
數字變化時，每一位都縱向捲動到新的值。
適用情境
即時計數器、價格
在[套用位置]加入「里程表數字」(Odometer) 數字動畫，也叫 rolling numbers 或拉霸數字 (slot-machine digits)。
數值變化時，每一位都縱向捲動到新的數字，一律往前捲動，各位之間稍微錯開，結尾有輕微的回穩。
讓每一位數字寬度相同，避免整個數字位移；只提供最終數值給螢幕閱讀器。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)。
游標移到文字上時，每個字母快速閃過隨機字元，再從左到右依序定格為真正的字母。
亂碼過程中文字寬度不要跳動，讓螢幕閱讀器始終讀取真實文字，並且在鍵盤焦點時呈現同樣的效果。AGBHCIDJEKFL
將滑鼠移到上面
Text 3D Flip (3D 翻轉文字)
別稱 3D Flip Text Reveal
字母或單字繞軸做 3D 翻轉，露出背面的下一段文字。
適用情境
滑鼠懸停連結、標題
在[套用位置]加入「3D 翻轉文字」(Text 3D Flip) 懸停效果，也叫 3D flip text reveal。
游標移到文字上時，每個字母繞水平軸做 3D 翻轉，露出另一面的新字母，一個接一個快速流暢地掃過；游標移開時再翻回來。
翻轉過程中保持文字框尺寸不變，鍵盤聚焦時也顯示同樣的效果。- %
Number Ticker (數字遞增)
別稱 Count Up, Animated Counter, Number Counter, countUp
數字出現在畫面上時，從起始值計數到目標值。
適用情境
統計數據、KPI 區塊
在[套用位置]加入「數字遞增」(Number Ticker)，也叫 count up 或 animated counter。
數字進入畫面時，從零計數到目標值，一開始快，接近終點時柔和地放慢。
使用等寬數字，避免周圍內容抖動；只計數一次；對螢幕閱讀器以及開啟了「減少動態效果」(prefers-reduced-motion) 的使用者，直接顯示最終數值。Text 中的其他動效
ABCDEF
Squiggly Text (扭動文字)
別稱 Wobbly Text, Turbulence Text
透過 SVG 置換濾鏡，字母邊緣像手繪一樣抖動。
適用情境
草圖風或俏皮的標題
在[套用位置]加入「扭動文字」(Squiggly Text) 效果，也叫 wobbly text 或 turbulence text。
字母邊緣輕微抖動，就像每秒被手工重畫好幾次：是含蓄、細碎的抖動，而不是流暢的波浪。
保持文字可讀；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就保持靜止。ABC DEFGHI JKLMNO PQR
在裡面捲動
Sticky Text Fade (固定文字淡入淡出)
別稱 Sticky Scroll Text Opacity Fade
文字固定不動，各行隨捲動進度淡入淡出。
適用情境
捲動敘事
在[套用位置]加入「固定文字淡入淡出」(Sticky Text Fade) 效果，也叫 sticky scroll text opacity fade。
該區塊捲動期間，文字區塊固定在原位，各行隨捲動進度逐行淡入淡出。
讓淡入淡出直接跟隨捲動位置，往回捲動時隨之反轉；無論透明度如何，每一行都要能被螢幕閱讀器讀到。Stroke Text Draw (文字描邊繪製)
別稱 Draw In Text, Animated Stroke Text
先以描邊畫出字母輪廓，再顯示填色。
適用情境
Logo、首屏大字
在[套用位置]加入「文字描邊繪製」(Stroke Text Draw) 效果，也叫 draw in text 或 animated stroke text。
字母輪廓流暢地逐筆畫出，輪廓完成後填色再淡入。
頁面載入時只播放一次，讓文字保持為可存取的真實文字；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就直接顯示已填色的文字。