plyr

# Plyr

> [!IMPORTANT]
> **Plyr, meet Video.js 👋**
>
> The folks behind Plyr, Vidstack and Media Chrome have joined forces to build the latest version of Video.js: one modern, accessible player with the best of all three. Plyr is now deprecated and receives security updates only. Use Video.js 10 for new projects.
>
> **[Try Video.js →](https://videojs.org?utm_source=plyr)** · **[Migrate from Plyr →](https://videojs.org/docs/framework/html/guides/migrate-from-plyr?utm_source=plyr)**
>
> Using React? Follow the [React migration guide](https://videojs.org/docs/framework/react/guides/migrate-from-plyr?utm_source=plyr) instead. AI coding agents can install the [Video.js skill](https://github.com/videojs/skills) or run `npx @videojs/cli agents init` for version-matched Video.js 10 docs.

Plyr is a simple, lightweight, accessible and customizable HTML5, YouTube and Vimeo media player that supports [_modern_](#browser-support) browsers.

Need video hosting? [Check out Mux!](https://mux.com?ref=plyr-github)

[![npm version](https://badge.fury.io/js/plyr.svg)](https://badge.fury.io/js/plyr) [![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/sampotts/plyr) [![Financial Contributors on Open Collective](https://opencollective.com/plyr/all/badge.svg?label=financial+contributors)](https://opencollective.com/plyr)

![Screenshot of Plyr](https://cdn.plyr.io/static/screenshot.webp)

## Features

- 📼 **HTML Video & Audio, YouTube & Vimeo** - support for the major formats
- 💪 **Accessible** - full support for VTT captions and screen readers
- 🔧 **[Customizable](#html)** - make the player look how you want with the markup you want
- 😎 **Clean HTML** - uses the _right_ elements. `<input type="range">` for volume and `<progress>` for progress and well, `<button>`s for buttons. There's no
  `<span>` or `<a href="#">` button hacks
- 📱 **Responsive** - works with any screen size
- 💵 **[Monetization](#ads)** - make money from your videos
- 📹 **[Streaming](#demos)** - support for hls.js, Shaka and dash.js streaming playback
- 🎛 **[API](#api)** - toggle playback, volume, seeking, and more through a standardized API
- 🎤 **[Events](#events)** - no messing around with Vimeo and YouTube APIs, all events are standardized across formats
- 🔎 **[Fullscreen](#fullscreen)** - supports native fullscreen with fallback to "full window" modes
- ⌨️ **[Shortcuts](#shortcuts)** - supports keyboard shortcuts
- 🖥 **Picture-in-Picture** - supports picture-in-picture mode
- 📱 **Playsinline** - supports the `playsinline` attribute
- 🏎 **Speed controls** - adjust speed on the fly
- 📖 **Multiple captions** - support for multiple caption tracks
- 🌎 **i18n support** - support for internationalization of controls
- 👌 **[Preview thumbnails](#preview-thumbnails)** - support for displaying preview thumbnails
- 🤟 **No frameworks** - written in "vanilla" ES6 JavaScript, no jQuery required
- 💁‍♀️ **Sass** - to include in your