xr-view

Put people
inside the image.

A focused, embeddable viewer for 360° and panoramic imagery. Add one element and let people explore by dragging, entering fullscreen, or putting on a headset.

Read the docs Try the demo ↓
$ npm install xr-view
<xr-view src="mountain.jpg">

Drag to look around

One element

Drop it into any HTML page.

Every screen

Responsive from mobile to headset.

Natural controls

Drag, auto-pan, fullscreen, and WebXR.

Quick start

Load the module, point the component at an equirectangular image, and size it with CSS.

No new framework and no complicated scene graph. xr-view packages the rendering, controls, responsive sizing, and immersive handoff behind a familiar custom element.

Full installation guide
index.htmlHTML
<!-- Register the component -->
<script type="module" src="/xr-view.js"></script>

<xr-view src="/photosphere.jpg"></xr-view>