Getting Started

Note: This documentation is for the old 0.1.0 version of A-Frame. Check out the documentation for the current 1.5.0 version

A-Frame is a framework for creating virtual reality web experiences that work across desktop, mobile, and the Oculus Rift.

There are several ways to get started with A-Frame:

See Installation for details.

To start an A-Frame scene, we import the A-Frame JavaScript file, and add an <a-scene> element. Every A-Frame object—from cubes to entities to animations—need to be placed within an <a-scene></a-scene>.

<!doctype html>
<html>
  <head>
    <title>My first VR site</title>
    <script src="https://aframe.io/releases/latest/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
    </a-scene>
  </body>
</html>

Our A-Frame scene is ready to start adding objects to! Let’s start with a simple cube.

<!doctype html>
<html>
  <head>
    <title>My first VR site</title>
    <script src="https://aframe.io/releases/latest/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-cube></a-cube>
    </a-scene>
  </body>
</html>

When we open our scene in the browser, we can see the cube!