videojs-vr

Immersive 360 and VR video player with WebXR support

WebXR Ready VR HUD Controls In-VR Gallery Three.js Powered

Live Demo

Controls: Drag to look around • VR Mode: Click the VR button to enter immersive mode • In VR: Squeeze grip to show controls

Features

🥽

Full WebXR Support

Works with Meta Quest, Vive, Index, and all WebXR-compatible headsets

🎮

VR Controller Support

Point-and-click interaction with controller rays and grip toggle

📺

VR HUD Controls

Scrub bar, play/pause, next/previous, and orientation controls in VR

🖼️

In-VR Gallery

Browse and select media without leaving VR mode

🌐

Multiple Projections

360, 180, cube map, EAC, and side-by-side stereo formats

📱

Mobile & Desktop

Responsive design with gyroscope support on mobile devices

Examples

360

360 Video

Full spherical equirectangular video projection

 360

360 Video (Alt)

Another 360 video example with different content

 360_TB

360 Top-Bottom

Stereoscopic 360 with top/bottom eye layout

 360_CUBE

360 Cube Map

Cube map projection for 360 content

 180_LR

180 Video

180-degree half sphere with side-by-side stereo

 180_MONO

180 Mono

Monoscopic 180-degree video projection

 EAC

Equi-Angular Cubemap

YouTube's EAC format for efficient 360 video

 EAC_LR

EAC Stereo

EAC with left/right stereoscopic layout

 Fluid

Fluid Layout

Responsive video player that adapts to container size

 Audio

Spatial Audio

360 video with Omnitone spatial audio support

 Quality

High Detail Sphere

360 video with increased sphere mesh detail

 Dev

Debug Tests

Run unit tests in the browser