---
title: "Make Transparent MP4 Styled with CSS"
description: "Make Transparent MP4 Styled with CSS | Cuberto BlogServicesProjectsCompanyBlogContactsMenuServicesProjectsCompanyBlogContactsGet in touchinfo@cuberto.comOur workflowcontact-contact-contact-contact-Dev Source6/7/2021Make Transparent MP4 Styled with CSSThis is a simple but neat technique to remove the background from a…"
url: https://nexonsoftware.com/make-transparent-mp4-styled-with-css/
date_published: 2026-06-07T17:24:57+00:00
date_modified: 2026-06-20T10:56:55+00:00
site: "Nexonsoftware"
agent_standard: ugentic/1.0
---

Make Transparent MP4 Styled with CSS | Cuberto Blog
[https://nexonsoftware.com/?page_id=20&preview=true](https://nexonsoftware.com/?page_id=20&preview=true)[https://nexonsoftware.com/?page_id=20&preview=true](https://nexonsoftware.com/?page_id=20&preview=true)
[Services](https://nexonsoftware.com/?page_id=21&preview=true)
[Projects](https://nexonsoftware.com/?page_id=22&preview=true)
[Company](https://nexonsoftware.com/?page_id=23&preview=true)
[Blog](https://nexonsoftware.com/?page_id=24&preview=true)
[Contacts](https://nexonsoftware.com/?page_id=25&preview=true)
### Menu
[Services](https://nexonsoftware.com/?page_id=21&preview=true)
[Projects](https://nexonsoftware.com/?page_id=22&preview=true)
[Company](https://nexonsoftware.com/?page_id=23&preview=true)
[Blog](https://nexonsoftware.com/?page_id=24&preview=true)
[Contacts](https://nexonsoftware.com/?page_id=25&preview=true)
### Get in touch
[info@cuberto.com](mailto:info@cuberto.com)
[Our workflow](https://nexonsoftware.com/?page_id=20&preview=true)
[https://nexonsoftware.com/?page_id=25&preview=true](https://nexonsoftware.com/?page_id=25&preview=true)
Dev Source
6/7/2021
# Make Transparent MP4 Styled with CSS
This is a simple but neat technique to remove the background from a black and white video and color it using the mix-blend-mode property using pure CSS.
Have you ever wondered how to make an mp4 file with a transparent background and paint it through the blend mode? Because if you have, this technique will be useful to you. This is a kind of emulation of WebGL spheres.
This is a simple but neat technique to remove the background from a black and white video and color it using the mix-blend-mode property using pure CSS. This technique allows you to emulate various looped and dynamic spheres and shapes without using WebGL with a pre-prepared video.
The archive contains a simple demo project with some comments in the code. Instructions on how to deploy and run the application are in the README.md file.
[https://github.com/Cuberto/transparentize-video-demo](https://github.com/Cuberto/transparentize-video-demo)
Share
[https://www.facebook.com/sharer/sharer.php?u=https://cuberto.co/blog/make-transparent-mp4-styled-css/](https://www.facebook.com/sharer/sharer.php?u=https://cuberto.co/blog/make-transparent-mp4-styled-css/)
[https://www.linkedin.com/sharing/share-offsite/?url=https://cuberto.co/blog/make-transparent-mp4-styled-css/](https://www.linkedin.com/sharing/share-offsite/?url=https://cuberto.co/blog/make-transparent-mp4-styled-css/)
[https://twitter.com/intent/tweet?url=https://cuberto.co/blog/make-transparent-mp4-styled-css/](https://twitter.com/intent/tweet?url=https://cuberto.co/blog/make-transparent-mp4-styled-css/)
Related Posts
[Dynamic Marquee JS Effect](https://nexonsoftware.com/?page_id=34&preview=true)
[Cuberto Particles (JS Library)](https://nexonsoftware.com/?page_id=30&preview=true)
[Header Hover Inspirations with JS Examples](https://nexonsoftware.com/?page_id=37&preview=true)
## Have an idea?
[Tell us](https://nexonsoftware.com/?page_id=25&preview=true)
[info@cuberto.com](mailto:info@cuberto.com)
Main office
901 N Pitt Street
Alexandria VA, 22314
[+1 301 549 9309](tel:+13015499309)
Second office
Na Perstyne
342/1, 11000 Prague
[Services](https://nexonsoftware.com/?page_id=21&preview=true)[Blog](https://nexonsoftware.com/?page_id=24&preview=true)[Projects](https://nexonsoftware.com/?page_id=22&preview=true)[Workflow](https://nexonsoftware.com/?page_id=20&preview=true)[Company](https://nexonsoftware.com/?page_id=23&preview=true)[Contacts](https://nexonsoftware.com/?page_id=25&preview=true)
[Privacy Policy](https://nexonsoftware.com/?page_id=26&preview=true)
2026, Cuberto
[https://www.instagram.com/cubertodesign/](https://www.instagram.com/cubertodesign/)
[https://www.youtube.com/channel/UCzestFrXpwSGCfcbO2pObwQ](https://www.youtube.com/channel/UCzestFrXpwSGCfcbO2pObwQ)
[https://github.com/Cuberto](https://github.com/Cuberto)
[https://www.facebook.com/Cuberto.design/](https://www.facebook.com/Cuberto.design/)
[https://dribbble.com/cuberto](https://dribbble.com/cuberto)
[https://www.behance.net/cuberto](https://www.behance.net/cuberto)