Getting Started

Note: This documentation is for the old 0.1.0 version of A-Frame. Check out the documentation for the current 0.7.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!