Streaming live at 10am (PST)

How to add mesh overlay to image or video


#1

Hi, I know webflow can add image or color overlay to background image or video. I want to add mesh overlay, like this

,
I upload a mesh pic, but don't know how to set the overlay pic opacity? Is there another way can do this ?

Thanks


Here is my public share link: https://preview.webflow.com/preview/anderson-6f6d9b?preview=ba2469c8154c4c010d9cf2dce32eba8e
(how to access public share link)


#2

The proper way to do it is with a png file that contains the pattern that you want on top of your image.

Here is a project where you can see how I built it:

Go to page "Overlay Mesh" to see every part of it.

https://preview.webflow.com/preview/testingplayground?preview=eaf772107fb9b54c77952adb2d2647e2

If you want to adjust the opacity of the mesh you need to put the pattern image background div on top of the image and give it a specific opacity.

Let me know if that helps.


#3

Great, Thanks. It works.

Can you help me check this problem?

Noboby reply.
Thanks


#4

I was just trying to do this! Thanks!


#5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.