Transparent video is the one part of overlay work where everything looks fine right up until it does not. There is no error message. The file plays, the colours are right, and there is a grey or black rectangle behind your subject that was not there in your editor. Almost every page on this query either hand-waves the format question or gives advice that produces exactly that rectangle. This one is written from having got it wrong and then found out why — the trap is real, it is specific, and once you know it the fix takes one line.
Export the clip as WEBM with an alpha channel (VP8 or VP9), then upload it to Kloot’s Media tool and pin it to a deck key. It plays on your existing Kloot browser source with the background cut out. MP4 cannot carry transparency at all, which is the usual cause of a grey box.
You set it up here
It lands here — fired by hand
What you’ll build
A genuinely transparent clip composited over your gameplay, plus enough understanding of the format to tell a good export from a broken one before you go live with it.
WEBM carries transparency properly through VP8 or VP9 — that is the format you want. MP4 (H.264) has no alpha channel at all, so a “transparent MP4” is not a thing regardless of what your editor showed you. A QuickTime .MOV can carry alpha, but only when it was exported with an alpha-capable codec: ProRes 4444, Animation, or PNG. A plain H.264 .MOV has nothing to preserve.
If you only remember one line: export WEBM (VP9) with alpha, or ProRes 4444 .MOV if your editor cannot write WEBM.
Two different failures produce the same rectangle. The first is exporting to a format with no alpha channel, which is silent. The second is subtler and catches people who did everything right: in a WEBM, the alpha channel lives in a separate side channel rather than in the pixel format, so a genuinely transparent file can report a plain opaque pixel format when inspected. A converter that trusts that reading throws the transparency away and synthesises a flat one instead — which renders your subject on a grey rectangle, strictly worse than not trying.
This is why a file can look transparent in VLC and land as a box on stream: different decoders make different decisions about that side channel.
Paste your Kloot overlay URL into one Browser source and size it to your canvas. This is the only source you need — the same URL carries your clips and every other Kloot tool. Leave hardware acceleration in OBS alone; nothing here requires you to change it.
Drag the file into the Media tool. Kloot probes it in your browser and tells you what it found, then previews it on a checkerboard — the same background image editors use, and for the same reason: on a solid backdrop a transparent file and a broken one look identical. If you can see the checkerboard through your subject, the alpha survived. If you see grey, it did not, and no setting further down will rescue it.
Check the preview before you pin anything. Ten seconds here beats finding out during a raid.
Choose a position zone and scale, or set it to Full stage. Then pick whether it draws behind your other widgets or in front of them. Either way it stays below a privacy Cover and below your BRB and Starting Soon screens, so a clip can never cover something you put up deliberately.
Pin the item to a deck key and press it. Fire plays once and clears itself; Hold keeps it up and loops until you press again. If a clip’s decoder ever fails mid-playback, the renderer hides the element rather than leaving its last frame frozen on your stream — a stuck frame is a worse failure than a missing clip.
Upload once, then it is one press. Here is the whole loop — what you do, what the overlay shows, and what your viewers actually see.
Drag a folder of alerts, frames and sounds into the Media tool. Each file is probed in your browser first for length, dimensions and whether it actually carries transparency, so anything that will not work says so before it uploads rather than halfway through.
WEBM and MP4 go straight through. A QuickTime .MOV is converted server-side to alpha-preserving VP9, which takes a minute or two — the item shows as processing and cannot be fired until it is ready, rather than pretending and failing on stream. Conversion is a Creator feature.
Pin the item to a key. The key takes the clip’s own artwork rather than a generic glyph, and video keys play their thumbnail — because a stinger’s opening frame is often nearly empty, and two alerts from one designer’s pack routinely share it. You recognise your own clips by motion.
A Fire item plays once and hides itself. A Hold item stays up until you press again, looping if it has anything to loop. Nothing triggers on its own — there is no chat integration and no event listener anywhere in Kloot, so a clip only ever goes out because you pressed something.
A Fire item ends on its own. A held frame waits for the same key again. If a clip’s decoder ever dies mid-playback the renderer hides it rather than leaving the last frame frozen on your stream — the switch stays reading ON, which is honest about what actually failed.
Every other tool draws something Kloot designed. This is the one that draws what you brought:
When: A folder of alerts, stingers and frames is sitting on your drive because there was never anywhere to put them.
Why it works: The work is done and the money is spent. Media is the part that was missing — a place to put the files and a key to fire them from.
When: Your channel has a look, and the effects on your deck do not share it.
Why it works: Generic effects read as generic. Firing something a viewer recognises as yours is a different signal entirely, and it costs one upload.
When: You have a PNG frame that fits your layout better than any template.
Why it works: Held media takes your own file at your own position and size, and stays up all stream. No template to compromise with.
When: An overlay pack downloaded, unzipped, and abandoned because wiring it into OBS meant a source per file.
Why it works: Upload the files, pin the ones you use, ignore the rest. The pack becomes a deck page instead of a folder.
The same file, rendered two ways — then the three shapes an uploaded file takes once the alpha survives.
A grey rectangle behind your subject — and no error anywhere. The encode reported success. That is what makes this so hard to debug: nothing failed, the alpha was just quietly thrown away.
The subject cut out, the checkerboard showing through it. Kloot’s editor previews every clip on this exact background for one reason: on a solid backdrop, a broken file and a good one look identical.
The stinger, the alert, the celebration — one press, then gone.
A sub lands, you press the key, your designer’s animation plays over the game and clears itself. Fire clips may play for up to 30 seconds; past that a clip is a scene rather than an effect, and Kloot points you at Hold instead.
Momentary key — press, it playsThe webcam border or overlay plate that stays up all session.
Your own transparent PNG at your own position and size, holding a corner until you toggle it off. Video holds loop rather than freezing on their last frame, so an ambient background actually stays ambient.
Switch — press on, press offYour logo
A logo, a rules card, a sponsor plate, a QR you drew yourself.
Images cost nothing to hold and are exempt from the two-video concurrency limit, so a still can sit on screen alongside whatever else you are firing.
Switch — up until you clear itA held frame sits behind your widgets and holds its corner; a fired clip takes the front layer for as long as it plays. Both ride the one browser source you already added.
Either the file has no alpha channel to begin with — an MP4, or a .MOV exported with H.264 — or a conversion step somewhere discarded it. Both fail silently: you get a rectangle, never an error. Preview the clip on a checkerboard before you use it; that is the only reliable way to tell the two apart.
No. H.264 in MP4 has no alpha channel. Some editors will happily let you export a composition with a transparent background to MP4 and simply fill it with black or grey. Use WEBM instead.
Only if it was exported with an alpha-capable codec — ProRes 4444, Animation, or PNG. Those genuinely carry alpha. A .MOV exported with H.264 does not, and no conversion can recover something the file never contained.
Both support alpha in WEBM. VP9 generally produces a smaller file at the same quality, so it is the better default. If your editor only offers VP8, that works too.
No. A browser source composites transparency normally; there is no toggle to find. If your clip shows a box, the problem is in the file, not in OBS.
Yes. Free holds two media items with clips up to 60 seconds and 25 MB per file, and the checkerboard preview is the same on every plan — so you can verify an export is genuinely transparent without paying anything.
Upload it and Kloot converts it to alpha-preserving WEBM for you, reading the transparency off the decoder rather than trusting the container. Conversion is a Creator feature ($15/mo).
Upload a transparent WEBM and check it on a checkerboard before it ever goes out — or hand us the .MOV and we will convert it properly. Two items are free.
Start freeFree plan · Creator $15/mo · Pro $25/mo · .MOV conversion on Creator and up