node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »



A Video Billboard entity & component for A-Frame.

Create an <a-video-billboard /> entity, streaming video from the user's camera to a plane in 3D space.

Note: Requires the latest WebRTC spec. This can be easily shimmed with webrtc-adapter

By default, will select the "back" facing camera.



Use directly from the unpkg CDN:

  <script src=""></script> 
  <script src=""></script> 
  <script src=""></script> 
    <a-video-billboard position="0 0 -5"></a-video-billboard>


Install via npm:

npm install aframe-video-billboard

Then register and use.

import aframe from 'aframe';
import registerVideoBillboard from 'aframe-video-billboard';

video-billboard component

Note: The <a-video-billboard> entity automatically includes the video-billboard component.


attribute type default description
deviceId string '' Select the specific device for display. If omitted, will attempt to get the rear-facing video stream. If rear-facing video stream not detected, will get the first video stream found. Note that if it is not a valid video device, nothing will be shown.
minWidth number 4 The minimum width in world-units to display the video. Video aspect ratio will be preserved.
minHeight number 3 The minimum height in world-units to display the video. Video aspect ratio will be preserved.


event name data description
video-play {source, stream} source is an instance of MediaDeviceInfo. stream is an instance of MediaStream. Fired every time the source changes and video playback begins.