Progressive Blur
Also called Gradient blur edge
Blur strength ramps gradually toward an edge so content fades out softly.
Use for
Scroll container edges, headers
Prompt
Replace [where] with the part of your page and paste the prompt into your AI agent. Each prompt includes the name of the motion, so next time you can simply ask for it by name.
Add a "Progressive Blur" edge (also called a gradient blur edge) to [where].
Content scrolling toward the edge should get gradually blurrier and softer, ramping smoothly instead of cutting off at a hard line.
Show the blur only at an edge that still has more content beyond it, and keep the blurred area from blocking clicks or scrolling.