Transparent background with three.js

javascript three.js transparent alpha

If you want a transparent background in three.js, you need pass in the alpha parameter to the WebGLRenderer constructor.

var renderer = new THREE.WebGLRenderer( { alpha: true } );

You can leave the clear color at the default value.

renderer.setClearColor( 0x000000, 0 ); // the default

three.js r.71

javascript three.js transparent alpha

You have also to set: scene.background = null;

Three.js v124

javascript three.js transparent alpha

A transparent background can be achieved with the following code.

scene.background = transparent;

CodeHunter