提示詞
將 [套用位置] 替換成你要套用的位置，再貼給 AI 代理。提示詞中包含動效名稱，下次只要說出名稱就能提出需求。
在[套用位置]加入「背景掃過」(Background Sweep) 懸停效果，也叫背景填充 (background fill) 或滑動填充 (slide fill)。
新的背景色從左側邊緣掃到右側，平順、快速、不回彈，游標移開時以同樣方式退回，同時文字顏色跟著切換以維持可讀性。
讓填色始終裁切在元素的形狀之內，鍵盤焦點時也呈現同樣的效果。相似的動效
A
將滑鼠移到上面
彩色背景從一側掃入，帶有彈性的輕微過衝。
適用情境
按鈕
在[套用位置]加入「背景彈性掃過」(Background Bounce Sweep) 懸停效果。
新的背景色從一側掃入，帶著彈性稍微越過另一側邊緣後再回穩，同時文字顏色跟著切換以維持可讀性；游標移開時平順地滑出。
讓文字始終位於填色之上，鍵盤焦點時也呈現同樣的效果。A
將滑鼠移到上面
游標懸停時元素內部的矩形放大或收縮，藉此切換背景。
適用情境
按鈕
在[套用位置]加入「矩形填充」(Rectangle Fill) 懸停效果。
隨著內部矩形往中心收縮，新背景色從四邊往內合攏；游標移開後再重新打開，同時文字顏色隨之切換，保持清楚易讀：流暢而快速。
文字始終位在填充層上方；鍵盤聚焦時也顯示同樣的效果。A
將滑鼠移到上面
Shutter Fill (百葉窗填充)
別稱 Shutter
懸停時，背景像百葉窗一樣從中間或兩側展開或合攏。
適用情境
按鈕、卡片
在[套用位置]加入「百葉窗填充」(Shutter Fill) 懸停效果，也叫百葉窗 (shutter)。
新的背景色從中間一條直線像百葉窗一樣向兩側展開，游標移開後再往中間合攏，同時文字顏色跟著切換以保持清楚易讀：流暢而快速。
填色要裁切在元素內部，文字保持在上方，鍵盤焦點時也呈現同樣的效果。A
B
移動指標試試
Direction Aware Hover (方向感知懸停)
別稱 Direction-aware overlay
遮罩層從游標進入的一側滑入，並朝游標離開的一側滑出。
適用情境
圖片藝廊、作品集網格
在[套用位置]加入「方向感知懸停」(Direction Aware Hover) 效果，也叫方向感知遮罩 (direction-aware overlay)。
遮罩層從游標進入的那一側滑入，再朝游標離開的那一側滑出：快速、流暢。
依據游標進入和離開時的位置判斷方向；觸控或鍵盤焦點時則統一使用一個預設方向。Hover 中的其他動效
A
將滑鼠移到上面
Bob (上下浮動)
別稱 Hang
懸停期間，元素先向上浮起，然後持續上下輕輕浮動。
適用情境
圖示、按鈕
在[套用位置]加入「上下浮動」(Bob) 懸停效果，也叫懸掛 (hang)。
元素先輕輕浮起，游標停留期間持續柔和地上下浮動，游標移開後再落回原位：緩慢而柔和。
只在懸停期間循環浮動；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就保持靜止。A
將滑鼠移到上面
懸停時，邊框顏色淡入或漸變為新顏色。
適用情境
按鈕、輸入框
在[套用位置]加入「邊框色漸變」(Border Fade) 懸停效果。
游標停在元素上時，邊框從柔和的顏色平順漸變為強調色：含蓄，不帶位移或尺寸變化。
兩種狀態下的邊框粗細保持一致，避免任何位移，鍵盤焦點時也呈現同樣的效果。A
將滑鼠移到上面
懸停時，同心的邊框圓環從元素向外擴散或向內收縮。
適用情境
按鈕
在[套用位置]加入「邊框漣漪」(Border Ripple) 懸停效果。
游標移入時，幾道邊框圓環依序從元素向外擴散並淡出：快速輕盈，像漣漪一樣。
每次懸停只播放一次、不要循環，也不要讓圓環推擠周圍的版面。