Question about color between object and background

hello, i try to make a simple puzzle game. but i have some problem.

i make some box and set color same to background color.

but it is not matched on result.

please see this screenshot.
image

and here is code.
image

i just create two light(directional, hemisphere) and no ambient light.

as i know MeshBasicMaterial not affect by light, so why show different color when i set a same color?

when i set a color to white(0xffffff) or black(0x000000) it works what i want.

i’m using r110 version.

best regards.

I’m afraid I’m not able to reproduce with the following live example:

https://jsfiddle.net/73zmbogj/

Can you please try to update the live example in order to demonstrate the issue?

first of all, i found what cause problem.

if WebGLRenderer’s gammaOutput is true, it show a color problem.

if gammaOutput are false, it works fine what i want.

what i understand after read document, if gammaOutput is true, all type of materials are affect the texture and color.

so if I want the background color and the color of the object to be the same, should the gammaOutput option be true?

in my previous practice, GLTF models are too dark when gammaOutput are false.

https://jsfiddle.net/r9kc5Lvq/4/

The problem is that scene.background is only affected by WebGLRenderer.gammaOutput if it is a texture. This is a known issue and tracked by https://github.com/mrdoob/three.js/issues/11337. The goal is to provide an easier-to use color management in three.js. For now, you can fix the issue like so:

scene.background.convertLinearToGamma( 2 );

This will perform the missing color space conversion.

https://jsfiddle.net/j6w8xcvg/

2 Likes

thanks!

problem is solved.