Why stream graphics use WEBM, not GIF
If your animated alert has a hard black or white edge, this is why — and how to fix it.
6 Sept 2026
The problem with GIF
GIF only supports binary transparency: each pixel is either fully opaque or fully invisible. There is no in-between. That means any soft edge — a glow, a rounded corner, a drop shadow — gets a hard jagged border against whatever is behind it.
On a stream, "whatever is behind it" is your gameplay. So the edge shows.
What WEBM does differently
WEBM (VP9) carries a real alpha channel with 256 levels of transparency, so soft edges stay soft. This is why OBS prefers it and why every animated asset we ship is WEBM.
Using it in OBS
Add animated files as a Media Source, not an Image source. An Image source cannot decode video and will show nothing or a black box.
- Tick Loop for background screens.
- Leave Loop unticked for alerts and transitions — they should play once.
- For a stinger: Settings → Stream Transitions → + → Stinger, choose the WEBM, and set the transition point to roughly halfway through its duration.
If you still see a black box
Either it was added as an Image source, or your OBS build is old enough to predate proper VP9 alpha support. Update OBS.
