Transparent Video on the Web

Real alpha channel transparency working across all major browsers - no hacks, no compromises.

Chrome / Firefox / Edge

WebM VP9 with Alpha

1.7 MB
File Size
VP9
Codec
yuva420p
Pixel Format
Encoded with ffmpeg libvpx-vp9
Safari (macOS / iOS)

HEVC with Alpha

3.5 MB
File Size
HEVC
Codec
hvc1
Tag
Encoded with Apple avconvert

Pure Transparency Demo

Videos placed directly on background — no containers, no tricks

WebM (Chrome/Firefox) · HEVC (Safari)
Same video, different position

The Workflow

1

Render PNG Sequence

Export your animation as PNG sequence with alpha channel (RGBA).

remotion render --sequence --image-format png
2

Encode WebM

Use ffmpeg with VP9 codec and yuva420p pixel format for Chrome/Firefox.

ffmpeg -c:v libvpx-vp9 -pix_fmt yuva420p
3

Encode HEVC

Use Apple's avconvert for proper HEVC alpha encoding for Safari.

avconvert --preset PresetHEVCHighestQualityWithAlpha