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)，则停止闪烁。