<a-image>

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

The image primitive displays an image on a flat plane. It is an entity that prescribes the geometry with its geometric primitive set to plane.

Example

<a-scene>
<a-assets>
<img id="my-image src="image.png">
</a-assets>

<!-- Using the asset management system. -->
<a-image src="#my-image"></a-image>

<!-- Defining the URL inline. Not recommended but more comfortable for web developers. -->
<a-image src="another-image.png"></a-image>
</a-scene>

Attributes

Note that the image primitive inherits common mesh attributes.

Attribute Component Mapping Default Value
height geometry.height 1.75
width geometry.width 1.75

Fine-Tuning

Ensuring that the image is not distorted by stretching requires us to approriately set the width and height.

<a-image src="#logo" width="200" height="100"></a-image>