NOTE: This version of the documentation tracks unstable development happening on A-Frame’s master branch. If you wish to try it out, grab the unstable build. Otherwise, head to the documentation for the current 1.6.0 version

The plane primitive creates flat surfaces using the geometry component with the type set to plane.


<img id="ground" src="ground.jpg">

<!-- Basic plane. -->
<a-plane color="#CCC" height="20" width="20"></a-plane>

<!-- Textured plane parallel to ground. -->
<a-plane src="#ground" height="100" width="100" rotation="-90 0 0"></a-plane>


Attribute Component Mapping Default Value
ambient-occlusion-map material.ambientOcclusionMap None
ambient-occlusion-map-intensity material.ambientOcclusionMapIntensity 1
ambient-occlusion-texture-offset material.ambientOcclusionTextureOffset 0 0
ambient-occlusion-texture-repeat material.ambientOcclusionTextureRepeat 1 1
color material.color #FFF
displacement-bias material.displacementBias 0.5
displacement-map material.displacementMap None
displacement-scale material.displacementScale 1
displacement-texture-offset material.displacementTextureOffset 0 0
displacement-texture-repeat material.displacementTextureRepeat 1 1
env-map material.envMap None
fog material.fog true
height geometry.height 1
metalness material.metalness 0
normal-map material.normalMap None
normal-scale material.normalScale 1 1
normal-texture-offset material.normalTextureOffset 0 0
normal-texture-repeat material.normalTextureRepeat 1 1
repeat material.repeat 1 1
roughness material.roughness 0.5
segments-height geometry.segmentsHeight 1
segments-width geometry.segmentsWidth 1
spherical-env-map material.sphericalEnvMap None
src material.src None
width geometry.width 1
wireframe material.wireframe false
wireframe-linewidth material.wireframeLinewidth 2

Parallelizing to the Ground

To make a plane parallel to the ground or make a plane the ground itself, rotate it around the X-axis:

<a-plane rotation="-90 0 0"></a-plane>