![]() | A request that this article title be changed to A-Frame (extended reality framework) is under discussion . Please do not move this article until the discussion is closed. |
![]() | |
Developer(s) | Diego Marcos, Don McCurdy, Kevin Ngo |
---|---|
Initial release | December 2015 |
Stable release | 1.7.0 / February 20, 2025 [1] |
Repository | |
Written in | JavaScript |
Platform | Cross-platform |
Type | JavaScript framework |
License | MIT License |
Website | aframe |
A-Frame is an open-source web framework, written in JavaScript, for building virtual reality (VR) experiences. [2] It is maintained by developers from Supermedium (Diego Marcos, Kevin Ngo) and Google (Don McCurdy). A-Frame is an entity component system framework for Three.js where developers can create 3D and WebXR scenes using HTML. HTML provides a familiar authoring tool for web developers and designers while incorporating a popular game development pattern used by engines such as Unity.
A-Frame was originally developed within the Mozilla VR team during mid-to-late 2015. [3] A-Frame was created in order to allow web developers and designers to author 3D and VR experiences [4] with HTML without having to know WebGL. [5] A-Frame's first public release was on December 16, 2015. [6] On December 16, 2019 A-Frame version 1.0.0 was released. [7]
All online IDEs support A-Frame as a result of being based on HTML. Documentation is available for the API. [8] Support for developers committing to the library is provided via GitHub issues, while support for developers building apps and web pages is provided via StackOverflow. [9] Real-time on-line support is provided via Slack. [10] Most of the developers are also on Twitter [ citation needed ].
<html><head><scriptsrc="https://aframe.io/releases/1.3.0/aframe.min.js"></script></head><body><a-scene><a-boxposition="-1 0.5 -3"rotation="0 45 0"color="#4CC3D9"></a-box><a-sphereposition="0 1.25 -5"radius="1.25"color="#EF2D5E"></a-sphere><a-cylinderposition="1 0.75 -3"radius="0.5"height="1.5"color="#FFC65D"></a-cylinder><a-planeposition="0 0 -4"rotation="-90 0 0"width="4"height="4"color="#7BC8A4"></a-plane><a-skycolor="#ECECEC"></a-sky></a-scene></body></html>