HTML5 video support

Does this browser support HTML5 video?

Almost certainly. Every current browser supports the <video> element. However, codec and streaming support still varies:

Every current browser supports the HTML5 video element, MP4 with H.264, and Media Source Extensions. Native HLS playback is limited to Safari and a few mobile browsers. The interactive table on the HTML version of this page reports the visiting browser's results.

Why isn’t HTML5 video enough?

The native <video> tag is enough for a short clip that plays without controls. Once viewers control playback, the gaps show up quickly.

• Adaptive streaming. HLS plays natively in Safari and in a few mobile browsers. DASH plays natively nowhere. Everywhere else needs a JavaScript playback engine on top of Media Source Extensions, and a way to swap engines when the source changes.
• Consistent controls. Chrome, Safari, and Firefox each draw their own controls. You can hide them, but you can’t restyle or rearrange them.
• Captions, quality, speed, and chapters. The browser gives you no menu to pick text tracks, no quality selector, no playback speed control, and no chapter markers.
• Accessibility. Keyboard shortcuts, focus management, screen reader labels, and reduced-motion preferences are on you the moment you replace the native controls.
• Everything else. Thumbnail previews, live stream UI, AirPlay and Chromecast, error recovery, playback analytics, and sources like YouTube, Vimeo, or Mux each need their own wiring.

Video.js ships each of those as a component, so you take the ones you need and keep the rest of the web platform. Read more: Why Video.js?

Get started with Video.js

Here’s a basic video player you can build with Video.js:

<script type="module" src="https://cdn.jsdelivr.net/npm/@videojs/cdn@10.0.0-rc.4/video.js"></script>

<video-player>
  <video-skin>
    <video src="/video.mp4" playsinline></video>
  </video-skin>
</video-player>

import '@videojs/react/video/skin.css';
import { Video, VideoPlayer, VideoSkin } from '@videojs/react/video';

export function MyPlayer({ src }: { src: string }) {
  return (
    <VideoPlayer>
      <VideoSkin>
        <Video src={src} playsInline />
      </VideoSkin>
    </VideoPlayer>
  );
}

If you want to dive deeper, get started with our installation guide, which will guide you through generating a snippet that fits your use case.

Video.js 8 remains documented at legacy.videojs.org. If you’re looking to upgrade to newer versions, start with Migrate from Video.js 8.

For AI agents

Every page on this site is available as markdown, this one included.

• https://videojs.org/llms.txt indexes the documentation.
• Append .md to any documentation URL, including this one, to get its markdown.
• Send Accept: text/markdown when fetching a documentation URL and you’ll get markdown back.