[![Video.js logo][logo]][vjs]

Video.js — Web Video Player & Framework

[![NPM][npm-icon]][npm-link]

Update: Major changes are planned for Video.js 10, expected in early 2026. You can follow the discussion and future direction here: 👉 https://github.com/videojs/video.js/discussions/9035

Overview

Video.js is a powerful, full-featured, and open-source HTML5 video player framework designed for modern web applications. It provides a consistent and customizable playback experience across all major browsers, devices, and platforms, including desktops, mobile phones, tablets, and Smart TVs.

Out of the box, Video.js supports all commonly used web media formats, including adaptive streaming technologies such as HLS and DASH. Beyond its core functionality, Video.js can be extended through a large ecosystem of plugins, themes, and integrations, making it suitable for everything from simple embedded videos to large-scale streaming platforms.

Originally launched in May 2010, Video.js has grown into one of the most widely adopted video players on the web.

Adoption & Impact

Since its inception, Video.js has achieved impressive scale:

(source: [BuiltWith][builtwith])

👉 https://videojs.com/plugins/

Table of Contents

Quick Start

Thanks to the support of Fastly, Video.js is available via a free, globally distributed CDN, allowing you to get started in seconds.

CDN Installation (Recommended for Beginners)

Add the following tags to the of your HTML document:

<link href="//vjs.zencdn.net/8.23.4/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/8.23.4/video.min.js"></script>

This approach requires no build tools and is ideal for quick prototypes or static websites.

Alternative Installation Methods

Video.js can also be installed using several other methods depending on your workflow:

npm (Recommended for Modern Web Apps)

npm install video.js

This is ideal for projects using bundlers like Webpack, Vite, or Rollup.

unpkg CDN

<!-- Latest version -->
<link href="https://unpkg.com/video.js/dist/video-js.min.css" rel="stylesheet">
 <script src="https://unpkg.com/video.js/dist/video.min.js"></script>

<!-- Specific version -->
 <link href="https://unpkg.com/[email protected]/dist/video-js.min.css" rel="stylesheet">
 <script src="https://unpkg.com/[email protected]/dist/video.min.js"></script>

cdnjs

<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video-js.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.23.4/video.min.js"></script>

You can also download source files directly from the 👉 GitHub Releases

Basic Usage

Using Video.js is as simple as enhancing a standard HTML element.

Automatic Setup

Add the video-js class and a data-setup attribute:

<video
  id="my-player"
   class="video-js"
   controls
   preload="auto"
   poster="//vjs.zencdn.net/v/oceans.png"
   data-setup='{}'>

  <source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4" />
   <source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm" />
   <source src="//vjs.zencdn.net/v/oceans.ogv" type="video/ogg" />

  <p class="vjs-no-js">
     To view this video, please enable JavaScript and use a browser that
     <a href="https://videojs.com/html5-video-support/" target="_blank">
       supports HTML5 video
     </a>.
   </p>
 </video>

When the page loads, Video.js automatically detects the element and initializes the player.

Manual Initialization

If you prefer full control, omit data-setup and initialize the player in

var player = videojs('my-player');

You can also pass configuration options and a callback:

var options = {
  autoplay: false,
   controls: true,
   responsive: true
 };

var player = videojs('my-player', options, function onReady() {
   videojs.log('Player is ready');

  this.on('ended', function () {
     videojs.log('Playback finished');
   });
 });

Learn more about available configuration options here: 👉 [Video.js Options Guide][options]

Core Concepts

Customization & Plugins

Video.js is designed to be highly extensible:

Explore the plugin ecosystem: 👉 https://videojs.com/plugins/

Contributing

Video.js is a community-driven, open-source project. Contributions of all kinds are welcome, including:

Please read the full 👉 [Contributing Guide][contributing]

Project governance is handled by the Video.js Technical Steering Committee (TSC): https://github.com/videojs/admin/blob/main/GOVERNANCE.md

All contributions are made under the Apache 2.0 License, and no CLA is required. Contributors agree to the Developer’s Certificate of Origin (DCO 1.1).

Code of Conduct

This project follows a strict 👉 [Contributor Code of Conduct][coc]

All participants are expected to uphold respectful and inclusive behavior.

License

Video.js is licensed under the Apache License, Version 2.0.

“Video.js” is a registered trademark of [Brightcove, Inc.][bc]

Sponsorship

Development and maintenance are supported by the Corporate Shepherd role:

Additional support:

Resources & Links

[logo]: https://videojs.com/logo-white.png [vjs]: https://videojs.com [npm-icon]: https://nodei.co/npm/video.js.png?downloads=true&downloadRank=true [npm-link]: https://nodei.co/npm/video.js/ [options]: https://videojs.com/guides/options/ [plugins]: https://videojs.com/plugins/ [docs]: https://docs.videojs.com [fastly]: https://www.fastly.com [builtwith]: https://trends.builtwith.com/media/VideoJS [contributing]: https://github.com/videojs/admin/blob/main/CONTRIBUTING.md [coc]: https://github.com/videojs/admin/blob/main/CODE_OF_CONDUCT.md [bc]: https://www.brightcove.com [mux]: https://www.mux.com [browserstack]: https://browserstack.com [netlify]: https://www.netlify.com