Almost every motion designer exports a .MOV, and almost every browser overlay wants a WEBM. That conversion is where transparency goes to die, quietly. The file converts, the command exits zero, and the result is your subject on a grey rectangle. There are exactly two reasons that happens, both easy to fix once you know them, and both invisible from the outside — no warning, no non-zero exit code, nothing in the log. This page covers what to check, the flags that matter, and the shortcut if you would rather not touch a command line.
Confirm the MOV was exported with an alpha-capable codec — ProRes 4444, Animation or PNG — then encode to VP9 with a pixel format that carries alpha and alternate reference frames turned off. Or upload the MOV to Kloot and it converts it for you. Conversion is a Creator feature.
You set it up here
It lands here — fired by hand
What you’ll build
A WEBM that keeps its alpha channel, verified against a checkerboard rather than assumed — either converted yourself or handed to Kloot to do.
A .MOV is a container, not a codec, and only some codecs inside it carry transparency: ProRes 4444, Animation, or PNG. If your file was exported as H.264 in a .MOV wrapper — which is the default in a lot of editors — there is no alpha channel in it and no conversion can invent one. Re-export from the original project with an alpha-capable codec before doing anything else.
In After Effects, that means ProRes 4444 with RGB+Alpha selected, not just ProRes 422. The 422 variants have no alpha channel.
The first is the obvious one: a default encode to VP9 flattens the alpha channel unless you explicitly ask for a pixel format that carries it. The second is much less obvious and catches people converting an existing WEBM: in a VP8 or VP9 file, alpha lives in a separate side channel rather than in the pixel format, so a genuinely transparent file reports an ordinary opaque pixel format when inspected. A converter that trusts that reading discards the transparency and synthesises a flat channel — which puts your subject on a grey rectangle, strictly worse than leaving it alone.
This is why a file can look transparent in one player and land as a box in a browser: they disagree about that side channel.
Target VP9 and ask explicitly for a pixel format that carries alpha. Two things beyond that matter. Alternate reference frames must be disabled — they are incompatible with the alpha plane, and leaving them on is the classic reason a correctly-configured encode still comes out opaque. And when the source is itself a WEBM whose container claims alpha, select the libvpx decoder explicitly on the input side, or the native decoder hands the encoder an already-flattened image.
Your poster or thumbnail extraction needs the same decoder settings. Getting this wrong gives you a perfect clip with a grey thumbnail.
Do not trust that it worked because the command succeeded. Put the output over a checkerboard or a bright image and look at it. A black box is invisible against a dark preview and obvious against gameplay, which is the worst possible order to discover it in. This is the single step people skip and the reason the grey box is so common.
Drag the .MOV into Kloot’s Media tool and it is converted server-side to alpha-preserving VP9, reading the transparency off the decoder rather than trusting the container’s claim, with the poster frame extracted using the same settings. It takes a minute or two — the item shows as processing and cannot be fired until it is genuinely ready, rather than binding to a file the browser cannot decode. Conversion is a Creator feature.
Routing a shaky source through a re-encode is often a robustness win as well as a format one — a re-encoded file frequently plays more reliably than the original did.
Once it is ready, set the mode, position and size, and pin it to your deck. It plays through the single Kloot browser source already in your scene, alongside every other tool.
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 source MOV never had an alpha channel — an H.264 export in a .MOV wrapper is the usual culprit — or the encode flattened it. A default VP9 encode drops alpha unless you ask for a pixel format that carries it, and alternate reference frames must be off or the output comes out opaque anyway.
ProRes 4444, Animation, and PNG. ProRes 422 does not, despite the similar name. If you are exporting from After Effects, ProRes 4444 with RGB+Alpha is the setting you want.
Partly. Inspecting the pixel format works for a ProRes or PNG source, which decodes straight to an alpha-carrying format. It does not work for a VP8 or VP9 WEBM, where alpha lives in a side channel and the pixel format reads as ordinary. For those, the only reliable test is rendering it over a checkerboard.
Video uploads are capped at 200 MB, and a converted output at 50 MB. Clip length is capped at 5 minutes on Creator and Pro. Storage is a flat 500 MB on every plan.
Usually a minute or two, depending on length and resolution. The item shows as processing and cannot be fired until it is finished — deliberately, so you never bind a deck key to a file that is not ready.
Creator ($15/mo) and Pro ($25/mo). It stays paid because it is the one genuinely expensive operation here — a large encoder running for as long as the file needs. On Free, export a WEBM or MP4 from your editor and upload that directly instead.
Kloot reads the transparency off the decoder rather than trusting the container, encodes alpha-preserving VP9, and previews the result on a checkerboard so you can see it worked. Conversion is on Creator and up.
See plansFree plan · Creator $15/mo · Pro $25/mo · .MOV conversion on Creator and up