How can I make my image banners fade smoothly into the background?

Hi

I want to make all my image banners to fade off a little.

I want them to be kinda smooth with background/other sections without straight borders.

URL: https://60338a.myshopify.com/

You can either edit the banner images themselves to add a gradient or use something like a box shadow or CSS gradient in your CSS: https://stackoverflow.com/questions/24768530/using-a-linear-gradient-on-all-four-sides-of-a-div

Do you know maybe code that will be applicable for my site?