Add overlay which spreads to full image

Is there any way to make Filter overlay all over the image?

{{ $img := $bg.Filter (images.Overlay $overlay 0 0)}}

We add starting poisition but how to add it like it starts from 0-100%?

If you know any other way achieve this please let me know!

Thank you

Are you asking if it’s possible to stretch/skew the overlay to always go over the whole original image? I don’t think that’s possible.

You could have an overlay image that has the same size as the original image, but I guess that is not your question here.

Yes it should cover the whole image.

That’s also tricky and I’ve resize overlay to that of image.

Is it important what the overlay is at what position (x,y)? If not, you could create a really large image that will fill any image size you could possibly have on your website (like 3000px x 3000px).

The overlay functionality is more or less for a watermark, which is something you put into a corner or somewhere prominent.

I ended up with CSS because this way requires a lot of computations.

I appreciate @davidsneighbour for your help and it’s best solution if we need to do with hugo only.

1 Like