Add overlay which spreads to full image

support
1

Hi
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

2

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.

3

Yes it should cover the whole image.

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

4

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.

5

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