
Join the Conversation!
Subscribing gives you access to the comments so you can share your ideas, ask questions, and connect with others.
"Please login to view comments"
Subscribing gives you access to the comments so you can share your ideas, ask questions, and connect with others.
Think about a simple room. When you turn on a light, everything becomes visible. The walls, the furniture, the floor—it all comes to life. Without light, the room is just darkness. The same idea applies to your 3D scenes in Three.js. Without light, your objects are there, but they feel flat and hard to see.
Light is what makes your scene look real. It helps you see shapes, colors, and details. In Three.js, you can add different types of lights, just like in real life.
For example:
In this lesson, we’ll learn how to use these lights to make your 3D scenes look amazing. Don’t worry—it’s easier than it sounds! Let’s get started.
Three.js DocsColorThe color of the light source (default is white).
IntensityThe strength of the light (higher values create brighter lights).
Casts shadowsDetermines whether the light contributes to shadows on objects (performance cost). We will learn shadows in the next chapter.
How did you manage to remove the blur property and reach here?
Upgrading gives you access to quizzes so you can test your knowledge, track progress, and improve your skills.
00:00:00 But how can we see the objects we've created if they're in the dark?
00:00:04 So, let there be light.
00:00:06 In 3DS, light illuminates the 3D scene, making it more realistic and clearer.
00:00:12 Without lights, your 3D objects would be completely dark.
00:00:16 Think about it.
00:00:17 Even in real life, you don't really see anything around you.
00:00:21 you see the light that bounces off of the objects and then back into your eyes, giving your brain the information to process their size,
00:00:30 shape, and color.
00:00:31 Different types of lights provide different effects.
00:00:34 For example, some light shines everywhere, like a light bulb, while others focus on one spot, like a stage spotlight.
00:00:43 or shine in a specific direction, like the Sun.
00:00:46 So, let's learn about different types of lights.
00:00:49 First, there's the ambient light, which provides uniform lightning to all objects in the scene without casting shadows.
00:00:57 We played around with some ambient lights on a mesh material a few minutes ago.
00:01:01 A real-life example of an ambient light would be a cloudy day.
00:01:06 On such days, sunlight is scattered by the clouds, so everything around us is lit evenly with no strong shadows.
00:01:14 It's soft.
00:01:15 Point light emits light from a single point in all directions.
00:01:20 It can create bright spots and shadows around the source.
00:01:24 Think of a light bulb in the middle of the room.
00:01:26 the light spreads out evenly in all directions, making things close to the bulb appear brighter and things farther away,
00:01:34 dimmer.
00:01:34 Direction light simulates parallel light rays coming from a specific direction, like sunlight.
00:01:41 It's used to create the effect of a distant light source.
00:01:45 It's like the sun on a clear day.
00:01:47 The sunlight comes from one direction and objects cast sharp shadows because the sun is so far away and the light rays are parallel.
00:01:56 Spotlight emits light in a cone shape similar to a flashlight.
00:02:00 It's useful for focused lightning effects or creating dramatic illumination.
00:02:05 In real life, It's similar to a spotlight on a stage during a performance.
00:02:09 It shines in a cone shape, focusing on one actor or object to create a dramatic effect with clear shadows.
00:02:16 Hemisphere light provides lightning from above and below the scene, simulating light from the sky.
00:02:22 I hope that makes sense.
00:02:23 If not, no worries.
00:02:25 It'll make much more sense when we dive into the code.
00:02:28 We'll do that soon after we discuss the last missing piece of the puzzle.
00:02:32 The camera.