Skip to main content
Skip table of contents


There are various ways of achieving transparency in WebGL. Unfortunately, there is not a perfect way to do so, but variations that can be used. We will explain two workflows, but if you are interested in combinations of them, please have a look here.

Please see the main material page to see how you can adjust materials via the API.

Alpha Map / Alpha Cutoff / Opacity

Alpha Map

available via material.alphaMap

The alpha map is used for per-pixel control of the alpha value.

Alpha Cutoff

available via material.alphaCutoff

The alpha cutoff is the value that is used to determine if the material is rendered. If the alpha is lower than this value, the material will not be rendered.


available via material.opacity

The opacity is the value that determines how transparent the material is. With 1.0 the material is fully opaque (if there is no alpha map applied).

Transmission / Volume / IOR




Note: This is a relatively new approach. We noticed that some devices suffer from performance and rendering issues when using this method.

Attenuation Color

available via material.attenuationColor

The color that the light turns to once the attenuation distance is reached.

Attenuation Distance

available via material.attenuationDistance

The distance for the attenuation, provided in world space.


available via material.ior

The index of refraction of the material.


available via material.thickness

The thickness of the material, provided in world space.

Thickness Map

available via material.thicknessMap

The thickness map of the material is used for per-pixel control of the value.


available via material.transmission

Degree of transmission, can be used to model materials that are see through but still have reflectivity.

Transmission Map

available via material.transmissionMap

The transmission map of the material is used for per-pixel control of the value.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.