So here is the code I used to make the mesh
const geometry = new THREE.PlaneBufferGeometry(30, 30, 256, 256);
const material = new THREE.MeshStandardMaterial({
color: "#303a4a",
wireframe: false,
side: THREE.DoubleSide,
});
const plane = new THREE.Mesh(geometry, material);
plane.rotation.x = Math.PI / 2;
scene.add(plane);
When I look at it, it looks like this (homogeneous)
side view
top view
There is a bump in the middle but it can’t be seen
Here is my lighting code
const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
directionalLight.rotation.x = Math.PI / 2;
scene.add(directionalLight);
const helper = new THREE.DirectionalLightHelper( directionalLight, 5 );
scene.add( helper );
const ambientLight = new THREE.AmbientLight(0xffffff, 0.7);
scene.add(ambientLight);