A material for a use with a Sprite.

Code Example

const map = new v3d.TextureLoader().load('textures/sprite.png'); const material = new v3d.SpriteMaterial({ map: map, color: 0xffffff }); const sprite = new v3d.Sprite(material); sprite.scale.set(200, 200, 1) scene.add(sprite);


webGL / sprites
software / sandbox
svg / sandbox
webgl / materials / cubemap / dynamic


SpriteMaterial(parameters : Object)

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set(color) is called internally. SpriteMaterials are not clipped by using Material.clippingPlanes.


See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.color : Color

Color of the material, by default set to white (0xffffff). The .map is mutiplied by the color.

.map : Texture

The texture map. Default is null.

.rotation : Radians

The rotation of the sprite in radians. Default is 0.

.sizeAttenuation : Boolean

Whether the size of the sprite is attenuated by the camera depth. (Perspective camera only.) Default is true.


See the base Material class for common methods.


For more info on how to obtain the source code of this module see this page.