Streaming live at 10am (PST)

Blur at the Bottom of scroll?


Hello, On my “Interested” page of my website is there any way to create a blur at the bottom the scroll instead of just having it be abruptly cutoff? Thanks!

Here is the link:


Hi @Sneakers12

Sure! just put some bottom padding to your grid :slight_smile:



Thank you but I think what I mean more is so that there is an initial blur always at the bottom the scroll. This page on Pinterest is a good example.


Something like that?



Yeah! Just like that! But without the darkening effect? How did you do that? Also any idea why there is a slight gap between the scroll fade and the Div block at the bottom?


So here’s the steps:

  1. Create a new div inside div block 75
  2. Make it 80px height (or the height you want)
  3. Set its position to absolute, bottom
  4. Set a background gradient (play with it as you want)

Finally, for the little gap at the bottom, select the div block 69 and set the overflow to scroll.

Here’s a quick video to show you the steps:


Hope this helps! :slight_smile:


Thank you for all your help Donald. But is there a way to gradient it back into the image instead of a color? As if the scroll is fading back into the image behind it.


So essentially it would look like the scroll box is coming out of the image?


Yes, like it was fading into the blurred image.