Please help with lighting / button issue!

Questions
1

I cannot figure out why there is so much light showing up on my images!!! Please help, it makes them look terrible. I have not added a light to the scene at all.

i can’t seem to find how to adjust the light that is apparently there, what is it attached to?
runScene() {

const canvas: any = document.getElementById('renderCanvas');    
const delayCreateScene = () => {    
const scene: any = new BABYLON.Scene(engine);
var camera = new BABYLON.ArcRotateCamera("cam", -Math.PI / 2, Math.PI / 2, 13, BABYLON.Vector3.Zero(), scene);

camera.wheelDeltaPercentage = 0.01;
camera.attachControl(canvas, true);    
camera.lowerRadiusLimit = 5;
camera.upperRadiusLimit = 20;



  var skydome = BABYLON.Mesh.CreateSphere('dome', 64, 220, scene);
  skydome.scaling = new BABYLON.Vector3(1.5, .6, 1.5);
  
  skydome.position.y = -30;
  var env_mat = new BABYLON.StandardMaterial("domemat", scene);
  
  env_mat.diffuseColor = new BABYLON.Color3( 0, 0, 0 );
  env_mat.specularColor = new BABYLON.Color3( 0, 0, 0 );
  var envtext = new BABYLON.Texture("../../assets/img/bg.png", scene);
  env_mat.diffuseTexture = envtext;
  envtext.vScale = -1.7;
  envtext.uScale = -1;

  env_mat.emissiveTexture = envtext;
  env_mat.emissiveColor = new BABYLON.Color3(0,0,0);
  env_mat.backFaceCulling = false;
  skydome.material = env_mat;


var anchor = new BABYLON.TransformNode("");      
var manager = new GUI.GUI3DManager(scene);
var panel = new GUI.SpherePanel();
panel.radius = 4;
panel.margin = 0.3;
panel.columns = 5;







manager.addControl(panel);
panel.linkToTransformNode(anchor);
panel.position.z = -1.5;

var addButton = function() {
  
  var button = new GUI.HolographicButton((panel.children.length+1).toString());
  
  panel.addControl(button);
  var number = panel.children.length;      
  // button.text = "Project Name" + panel.children.length;      
  button.onPointerClickObservable.add((button) => {
    buttonClicked(button, number);
  })

  button.onPointerEnterObservable.add((button) => {
    buttonEnter(button, number);
  })

  button.onPointerOutObservable.add((button) => {
    buttonExit(button, number);
  })
     
  
  button.contentResolution = 240;
  button.imageUrl = ("../../assets/img/"  + number + ".png");  
  // button.contentScaleRatio = 2.05;

}

var buttonEnter = function(button, id) {
console.log(“Enter”, id);
let thisNode = panel.children[id-1];
thisNode.scaling = new BABYLON.Vector3(3,3,3);
thisNode.position.z = thisNode.position.z -2;

}

var buttonExit = function(button, id) {
console.log(“Exit”, id)
let thisNode = panel.children[id-1]
thisNode.position.z = thisNode.position.z + 2;
thisNode.scaling = new BABYLON.Vector3(1,1,1);

}

var buttonClicked= function(button, id) {
console.log(id);

}

panel.blockLayout = true;
  for (var index = 0; index < 15; index++) {
      addButton();
  }
  panel.blockLayout = false;
  return scene;

}
const engine = new BABYLON.Engine(canvas);
const scene = delayCreateScene();

engine.runRenderLoop( () => {
  if (scene) {        
    scene.render();
  }
});
window.addEventListener('resize', () => {
  engine.resize();
});

}
}

2

bump it

3

Hey!
to get help quickly the best option is to reproduce the issue in the Playground