Why WebM alpha fails in Safari
Safari on macOS and iOS can decode VP9 WebM video, but at the time of writing it does not composite the WebM alpha channel. The video plays; the transparent area simply is not transparent. This is a browser limitation, not a problem with your file—the same file is transparent in Chrome, Firefox and Edge.
HEVC with alpha: Apple’s format
Apple introduced HEVC video with an alpha channel for Safari and iOS in 2019 (WWDC 2019, session 506). It is encoded with Apple’s own media frameworks, so it is made on a Mac—for example with Compressor, or with FFmpeg’s hevc_videotoolbox encoder, which runs only on macOS.
We do not produce HEVC with alpha yet, and we have not tested those Mac tools ourselves; treat the details as a starting point and check the result on a real iPhone.
Serving the right file to each browser
A common suggestion is to list both files in <source> elements and let the browser choose. Be careful: some non-Safari browsers can decode HEVC without its alpha, and would happily pick it. A small script that chooses by browser is more predictable:
<video id="presenter" autoplay muted loop playsinline></video>
<script>
const safari = /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);
document.getElementById('presenter').src = safari ? 'presenter-hevc.mov' : 'presenter.webm';
</script>
No HEVC file? Use a still in Safari
If you only have WebM, show a transparent PNG of a representative frame to Safari visitors and the moving WebM to everyone else. That is exactly what our own home page does: Safari gets a verified transparent still, other browsers get the video. Our result page can give you both—the WebM and, for images, a transparent PNG.