HTML Video Embed Builder
Builds an HTML5 <video> tag with source, controls, poster, autoplay and loop options.
HTML5 video tag with poster and autoplay
The video tag looks like the easy part of HTML right up to the day autoplay silently refuses to fire, or the clip loads and shoves the rest of the page down. Two well-known annoyances are behind most of that: browsers only allow unattended playback when the audio is muted, and without declared width and height nothing reserves the space beforehand.
You fill in the file URL, an optional poster, the dimensions, and answer the autoplay and loop fields. Both compare against the literal word sim, Portuguese for yes, so typing yes or 1 counts as no. Choosing sim for autoplay makes the tool write autoplay and muted together, the only combination Chrome and Safari accept. The controls attribute is always emitted, whether you asked for it or not.
For iPhones, add playsinline to the copied code or tapping play throws the video into fullscreen. A poster image spares visitors the grey rectangle before the first frame arrives. The output carries a single src, so if you want to serve WebM alongside MP4, replace it with two source tags inside the video element. None of this covers YouTube or Vimeo, which need their own iframes. It all runs in the browser.
Frequently asked questions
Why does autoplay come with muted attached?
How do I turn the controls off?
Can I embed a YouTube video with it?
Related Tools
YouTube Embed Builder
Builds a YouTube embed <iframe> from the video ID with customizable width and height.
Google Maps Embed Builder
Builds a simple <iframe> to embed Google Maps from an address or coordinates.
Iframe Builder
Builds a generic <iframe> with src, width, height and optional sandbox/allow attributes.
Twitch Embed Builder
Generate the embed code (iframe) for a Twitch player from the channel name and your site domain. Add live streams and VODs to your page in seconds.
Shields.io Badge Builder
Builds a shields.io badge URL from label, message and color, ready to embed in READMEs.
OpenStreetMap Embed Builder
Builds an OpenStreetMap <iframe> from a bounding box (lat/lng) and optional marker.