Adding Transparent Text to Blur Video

Hey WebWorld,

I have posted on this a couple times now, and can’t seem to stumble on the solution:

I am trying to blur out a video while setting transparent letters over it (looking through the blur into the actual clear video) I have tried creating a blurred PNG in SketchApp and lay it over the video, however, its seems the PNG only blurs out pictures it overlays.

I also messed around with the CSS about, but did more damage than good :frowning:

Does anyone have any suggestions / walk-through?

Thanks!

Cheers,
Chad


Here is my public share link: https://preview.webflow.com/preview/go-green-armour-splash-make-it-378cf8?preview=51397e64a062120a72b25ad2dfea351f

Hi Chad,
My first inclination is to say that I think this would be much more easily accomplished in something like AfterEffects and just bring the video in after you have the effect you want.

However, you might be able to get away with something crudely drawn if you want to try CSS. I don’t believe you can use type as a mask/clip with CSS, but you can draw shapes and use them that way.

This site might get you started if that’s the way you want to go. Please don’t ask my for my help with the CSS part. I haven’t a clue how to do it that way. Personally, I’d use AfterEffects. :slightly_smiling:

Good luck! Here’s the site: Clip Path Generator - CSS Plant

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