Three.js white background issue

Hi, I am trying to create a Three.js selective bloom effect, I have combined the following projects: three.js: Place Ground | 8th Wall | 8th Wall and Three.js: Postprocessing - Unreal Bloom | 8th Wall Playground | 8th Wall.

Currently, I am facing a white background issue. I have tried

window.XR8.Threejs.configure({renderCameraTexture: true})
cameraTexture = window.XR8.Threejs.xrScene().cameraTexture
const scene = new Scene()
scene.background = cameraTexture

and

renderer.setClearColor(0xffffff, 0)

But still, I am still facing a white background issue.

Hello @AliveNow_Inc are you recieving any console errors? More information would be helpful.

There are no errors displayed, except for the white screen issue.

If we did not create a new renderer, the white screen issue is not showing.
The code has been modified, and I am using the default scene, camera, and renderer.

const {scene, camera, renderer} = window.XR8.Threejs.xrScene()

The issue with the white screen has disappeared now.

2 Likes

How can I fix the white screen issue in Three.js, where the background remains white despite setting the render camera texture and clear color? Are there additional debugging steps or code tweaks that can help resolve this?

Can you share your code?