Hi everyone! I crafted this cut-off effect for an upcoming project and thought I should share it with the community. The window circle is animated using native Webflow interactions to follow the mouse movement through the viewport. Using CSS3 Blending Modes I managed to make the background behind visible. In this case, I used a video background but it can be replaced by a static image or a gif. (Keep the same classes and replace the video bg for a regular div, then add the background image in the styling panel). The Green version contains the demo content and some cosmetic styling, but I also included a "Warm/Clean" version (see footer) that contains just the effect so it's easier to implement on your own projects. I encourage you to play around with backgrounds in both the Mask-BG and the Animated-BG to achieve some mesmerizing visuals. A like is very appreciated if you clone and enjoy this work ♥️ Have fun building!

window,  customcursor,  cursor,  interactivecursor,  video,  videobackground,  backgroundvideo,  css,  css3,  blending,  blendmode,  mixblendmode,  cutoff