Progressive Blur (漸進模糊)
別稱 Gradient blur edge
模糊強度朝邊緣逐漸增加，讓內容柔和地淡出。
適用情境
捲動容器邊緣、頁首
提示詞
將 [套用位置] 替換成你要套用的位置，再貼給 AI 代理。提示詞中包含動效名稱，下次只要說出名稱就能提出需求。
在[套用位置]加入「漸進模糊」(Progressive Blur) 邊緣，也叫 gradient blur edge。
朝邊緣捲動的內容要逐漸變得更模糊、更柔和，平順過渡，而不是在一條生硬的線上被截斷。
只在後面還有更多內容的邊緣顯示模糊，而且模糊區域不能擋住點擊或捲動。相似的動效
ABC
移動指標試試
Focus Cards (聚焦卡片)
別稱 Blur siblings on hover, Hover focus blur, Card hover effect
懸停的卡片保持清晰，其餘卡片變得模糊、變暗。
適用情境
卡片網格、藝廊
在[套用位置]加入「聚焦卡片」(Focus Cards) 效果，也叫懸停時模糊其他卡片 (blur siblings on hover)、懸停聚焦模糊 (hover focus blur) 或卡片懸停效果 (card hover effect)。
游標停在某張卡片上時，其他卡片變模糊、變暗並略微縮小，懸停的卡片保持清晰；整個過程平順過渡，游標移開後恢復原狀。
鍵盤焦點時也採用同樣的聚焦效果；沒有懸停任何卡片時，所有卡片都保持清楚易讀。Blur-Up Placeholder (模糊佔位圖)
別稱 LQIP, Blur placeholder, Progressive image load
先用一張極小的模糊版圖片佔位，完整圖片載入後逐漸變清晰。
適用情境
主視覺大圖、圖庫
在[套用位置]加入「模糊佔位圖」(Blur-Up Placeholder) 圖片載入效果，也叫 LQIP 或 blur placeholder。
先立刻用一張極小、高度模糊的圖片填滿圖片位置，完整圖片載入完成後，平順且較快地變清晰。
預先保留圖片的準確尺寸，圖片載入時不能造成任何位移；並裁掉模糊的邊緣，不要溢出邊框。Background & Ambient 中的其他動效
Retro Grid (復古網格)
別稱 Perspective grid, Synthwave grid
傾斜的透視網格像合成波地面一樣朝觀看者捲動而來。
適用情境
復古和未來風主視覺
在[套用位置]加入「復古網格」(Retro Grid) 背景，也叫透視網格 (perspective grid) 或 synthwave grid。
一片向遠處傾斜的透視網格地面等速朝觀看者捲動，並在地平線處淡出：流暢、無盡。
循環要無縫，線條不能跳動；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就停止捲動。A
Ripple Rings (漣漪圓環)
別稱 Background ripple, Concentric ripples
同心圓從中心點向外擴散並逐漸淡出。
適用情境
主視覺中心元素、音訊或配對視覺
在[套用位置]加入「漣漪圓環」(Ripple Rings) 效果，也叫 background ripple 或 concentric ripples。
圓環從中心點不斷向外擴散，越大越淡，一個接一個、間距均勻：緩慢而穩定。
中心元素保持靜止、位置不變；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就停止漣漪。ABC
Sparkles (閃亮星點)
別稱 Glitter, Twinkle particles, Sparkles Text, Text Sparkle Particle Highlight
細小明亮的光點在文字或區塊周圍閃現又消失。
適用情境
大標題、質感點綴
在[套用位置]加入「閃亮星點」(Sparkles) 效果，也叫 glitter 或 twinkle particles。
小小的星形光點在文字周圍分散的位置、隨機的時刻冒出來，閃爍後淡出：輕盈而快速。
光點只作裝飾，要對螢幕閱讀器隱藏，絕不能遮住文字本身；如果使用者開啟了「減少動態效果」(prefers-reduced-motion)，就停止閃爍。