Skip to content

Instantly share code, notes, and snippets.

@glowacki-dev
Last active July 16, 2021 09:05
Show Gist options
  • Save glowacki-dev/52cbdb2c8356aea294b3352dca643fa3 to your computer and use it in GitHub Desktop.
Save glowacki-dev/52cbdb2c8356aea294b3352dca643fa3 to your computer and use it in GitHub Desktop.
Convert transparent webm video to transparent hevc video for safari on macos and ios. According to caniuse.com this gives 95.5% full support for browsers
# Extract video frames, set fps to actual fps of the video
ffmpeg -c:v libvpx-vp9 -i video.webm -vf fps=30 frame-%03d.png
# Merge frames back into movie and encode it to hevc with transparency
ffmpeg -i 'frame-%03d.png' -c:v hevc_videotoolbox -allow_sw 1 -alpha_quality 1 -vtag hvc1 -vf fps=30 hevc.mp4
<video>
<source type="video/webm" src="video.webm">
<source type='video/mp4; codecs="hvc1"' src="hevc.mp4">
<!-- Optional fallback without transparency -->
<source type="video/mp4" src="fallback.mp4">
</video>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment