How to make white model whiter in Three.js / Blender?

Questions
, ,
1

How can I further whiten a model that is already white?
I want a model to look like that:I want that
In blender it looks like that: Blender
On site it looks like that: Site

That’s my code:

<script setup>
onMounted(() => {
  const parentElement = document.getElementById('thats-me-block')

  //Scene
  const scene = new THREE.Scene()

  let globalGltf
  const loader = new GLTFLoader()
  const modelUrl = new URL('./assets/untitled.glb', import.meta.url).href
  loader.load(
    modelUrl,
    function (gltf) {
      globalGltf = gltf.scene
      globalGltf.scale.set(6, 15, 6)
      globalGltf.rotation.set(0, -0.2, 0)
      scene.add(globalGltf)
    },
    undefined,
    function (error) {
      console.error(error)
    }
  )

  //Camera
  const camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 100)
  camera.position.set(0, 2.80, 5.5)
  scene.add(camera)

  const directionalLight = new THREE.SpotLight('#FFFFFF', 7500)
  directionalLight.position.set(7.5, 5.5, 2.5)
  scene.add(directionalLight)
  const renderer = new THREE.WebGLRenderer({
    canvas: canvas.value,
    alpha: true,
    antialias: true
  })
  renderer.setPixelRatio(window.devicePixelRatio)
  renderer.setSize(350, 250)
  parentElement.appendChild(renderer.domElement)

  function animate() {
    renderer.render(scene, camera);
    if (globalGltf) {
      globalGltf.rotation.y -= 0.005
    }
  }

  renderer.setAnimationLoop(animate)

  function onWindowResize() {
    camera.aspect = window.innerWidth / window.innerHeight
    camera.updateProjectionMatrix()
    renderer.setSize(window.innerWidth, window.innerHeight)
  }

  window.addEventListener('resize', function () {
    onWindowResize();
  })
})
</script>

Not quite the effect I wanted to achieve. Any ideas? I am using Vue 3.0 and Three.js

2

Add and adjust THREE.AmbientLight() :thinking: