Attributes

All attributes are observed: changing them at runtime updates the player, and only the part affected is redrawn. Every attribute is also a property in camelCase (color-primary → player.colorPrimary).

Video source

Attribute	Default	Description
`src`	—	Video URL. Also the fallback for `responsive-src`.
`src-webm` / `src-mp4` / `src-ogg`	—	Same video in several formats; the browser picks. Take priority over `src`.
`responsive-src`	—	JSON array `[{"maxWidth":640,"src":"…","label":"360p"}, …, {"src":"…"}]`. See Quality.
`poster`	—	Poster image URL.
`preload`	`none`	`none`, `metadata` or `auto`.
`autoplay`	off	Starts by itself, muted if the browser blocks sound.
`muted`	off	Starts muted.
`loop`	off	Loops the video.
`aspect-ratio`	`16:9`	Any `W:H` or `W/H`. Invalid values fall back to 16:9.

Controls

Attribute	Default	Description
`controls-visible`	`true`	`false` disables the control bar.
`controls-hide-on-hover`	`false`	`true` hides the controls while the mouse is over the player.
`hide-on-play-delay`	`0`	Seconds without activity before the controls fade out during playback. `0` = never.
`volume-hide-delay`	`1`	Seconds the volume slider stays visible after opening or last use. `0` = only while hovering.
`pause-offscreen`	off	Pauses the video when the player scrolls out of view. `pause-offscreen="resume"` also plays it again when it comes back. Not while in fullscreen or Picture-in-Picture.
`show-stop-button`	off	Shows the stop button.
`hide-play-button`	off	Hides the large centre play button.
`hide-fullscreen-button`	off	Hides the fullscreen button.

Seek preview

Attribute	Default	Description
`thumbnails`	—	URL of a WebVTT thumbnails file, `auto` (generated, every device) or `none` (time only). Without it, thumbnails are generated on devices with a mouse. See Seek preview.

Play button

Attribute	Default	Description
`play-btn-size`	`md`	`sm`, `md` or `lg`.
`play-btn-color`	`rgba(255,255,255,0.9)`	Background color of the centre button.
`play-btn-icon`	—	Image URL, or inline SVG / icon-font markup (sanitised).

Theme

Attribute	Default	Description
`color-primary`	`#aaa`	Accent color.
`color-overlay`	`rgba(0,0,0,0.95)`	Modal background.
`color-controls`	`rgba(0,0,0,0.7)`	Control bar and menu background.

These can also be set from CSS. See CSS variables & parts.

Attribute	Default	Description
`modal-enabled`	`true`	`false` disables the modal.
`modal-title`	—	Title. Allows `br`, `b`, `strong`, `i`, `em`, `span`, `small`.
`modal-description`	—	Body text, same tags as the title.
`modal-description-color`	`rgba(255,255,255,0.7)`	Description color.
`modal-cta-text`	`Join Now`	Button text (alone it also enables the modal).
`modal-cta-url`	`#`	Button link. Only `http`, `https`, `mailto` and `tel`.
`modal-delay`	`0`	Second at which playback pauses and the modal opens. `0` = on pause.
`cta-bg-color`	`color-primary`	Button background.
`cta-text-color`	`#000`	Button text color.
`cta-hover-bg-color`	`#fff`	Button background on hover.
`cta-hover-text-color`	`#000`	Button text color on hover.

Error screen

Attribute	Default	Description
`error-title`	`Video Error`	Title of the error screen.
`error-retry-text`	`Retry`	Retry button text.

Extras

Attribute	Default	Description
`playback-rate`	`1`	Initial speed.
`show-playback-rate`	off	Shows the speed menu.
`qualities`	—	JSON array `[{"label":"720p","src":"…"}]`. Shows the quality menu.
`captions-src`	—	WebVTT captions URL.
`captions-label`	`Subtitles`	Captions track label.
`captions-default`	off	Shows captions from the start.
`enable-pip`	off	Picture-in-Picture button (where supported).
`enable-chromecast`	off	Cast button (needs the Cast SDK).