\
**Category:** web dev\
**Created:** [January 25, 2019, 6:57am UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323 "2019-01-25T06:57:36Z")\
**Posts on this page:** 5\
**Page:** 1
**Author:**  [@glassbeads](https://forum.kirupa.com/u/glassbeads)\
**Post date:** [January 25, 2019, 6:57am UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323/1 "2019-01-25T06:57:37Z")
is it possible using CSS and HTML to embed a video, then blur the video, and then overlay an (transparent) image over the video. so in other words, restating this — you would have a sort of transparent image that you could see through to the underlying blurred video. I would like to create this effect for a landing page but I have no idea what’s involved in creating something like this.
---
**Author:**  [@glassbeads](https://forum.kirupa.com/u/glassbeads)\
**Post date:** [January 25, 2019, 7:11am UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323/2 "2019-01-25T07:11:55Z")
i’m probably thinking about this wrong. Maybe I should’ve thought about it more before I posted the question. maybe first I should start with just getting the video blurred and on the page in a container or with flexbox. Yeah, let’s start there. that should be possible right?
---
**Author:**  [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 25, 2019, 8:55pm UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323/3 "2019-01-25T20:55:11Z")
You can apply a CSS filter to your video element:
```
.lookingCool {
filter: blur(2px);
}
```
That will give you the blurriness you are looking for. Overlaying an image on top of that will be straightforward from there 🙂
Cheers,
Kirupa
---
**Author:**  [@prg9](https://forum.kirupa.com/u/prg9)\
**Post date:** [January 26, 2019, 2:00am UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323/4 "2019-01-26T02:00:13Z")
> [@glassbeads](#):
>
> blur the video, and then overlay an (transparent) image over the video
Maybe keep in mind that could be resource intensive for some devices. @kirupa , or do you feel that would not become an issue?
---
**Author:**  [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 26, 2019, 4:56am UTC](https://forum.kirupa.com/t/video-and-image-overlay-using-css-and-html/639323/5 "2019-01-26T04:56:32Z")
Good point. While CSS filter effects do get hardware acceleration, it is worth double checking to be safe though 🙂