ThreeJS Lighting or Color Problems

Questions
,
1

Hello
I’m already deep into a project but i have some issues with color/lighting

2024-11-20_16h31_45
2024-11-20_16h31_451092×1277 25 KB

This one is a color close to sandgold that i want, but i cannot have it properly, it’s looks burned on my cube
2024-11-20_16h32_31
2024-11-20_16h32_311092×1277 83.8 KB

this one is the same material, all same, but grey, u can see the color on top right.

My question is, does threejs lighting affects colors? Or the other way ?

Here some of my code with hdri, lighting and the material.

function initRender() {
    renderer = new THREE.WebGLRenderer({ antialias: true, canvas: canvas });
    renderer.setPixelRatio(window.devicePixelRatio);
    renderer.setSize(width, height);
    renderer.physicalCorrectLights = true;
    renderer.setAnimationLoop(animate);
    document.body.appendChild(renderer.domElement);
    composer = new EffectComposer(renderer);
    const renderPass = new RenderPass(scene, camera);
    const outputPass = new OutputPass();
    composer.addPass(renderPass);
    composer.addPass(outputPass);
}

	materialSatine = createMaterial({
		color: colors[0].color,
		metalnessMap: brushedTextures03[0],
		normalMap: brushedTextures03[1],
		roughnessMap: brushedTextures03[2],
		name: 'Satiné'
	});

    rgbeLoader.load('myhdri.hdr', (texture) => {
        texture.mapping = THREE.EquirectangularReflectionMapping;
        scene.environment = texture;
        scene.background = texture;

        scene.environmentRotation = new THREE.Euler(-6.8,  1.14, 0, 'XYZ');
        scene.backgroundRotation  = new THREE.Euler(-6.8, 1.14, 0, 'XYZ');

        scene.environmentIntensity = .85;
        scene.background = new THREE.Color('black');
    });
    scene.add(new THREE.AmbientLight(0xffffff, .45));

Thank in advance, if u need more context, i will be happy to give some.

2

The ‘color’ of a PBR material (I assume you’re using MeshStandardMaterial?) basically defines reflectivity fractions of diffuse/ambient light for each of the RGB channels. This is not the same thing as the color resulting in the final image, which depends further on lighting (both diffuse and specular), tone mapping, transparency, etc.

… it’s looks burned on my cube

I’m not 100% sure what you mean by this, possibly the blown-out white area at upper-left and the hue shifts through yellow forming a diagonal band on the left? It looks to me like a symptom of either not using tone mapping, or of bad tone mapping and/or color grading. Less harsh lighting (more ambient, less direct) could perhaps help but I would personally start with tone mapping.