Video Player Generator
Generate HTML5 video markup with poster, controls, autoplay, muted, loop and playsinline attributes.
HTML5 video element with poster, controls and playback options.
Live preview
<video controls playsinline>
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>About the video player generator
Autoplay is blocked on every modern browser unless the video is muted, and on iOS it also needs playsinline or the video takes over the screen. Those two attributes are why most autoplay setups fail.
A poster image gives viewers something to look at while the video loads and prevents a black rectangle in the layout.
How to use it
- 1Set the video source and a poster image.
- 2Turn on controls unless it is purely decorative.
- 3For autoplay, enable muted and playsinline as well.
- 4Copy the HTML.
Questions
Why does my autoplay video not play?
Browsers block autoplay with sound. Add muted, and add playsinline so iOS does not open it fullscreen.
Do I need multiple source formats?
MP4 with H.264 plays everywhere. WebM can be smaller, so offering both lets the browser pick, but MP4 alone is fine.
Why use a poster image?
It fills the frame while the video loads, so the layout does not show a black box, and it gives you control over the first thing people see.