Create a custom light

I’m building a 3D room in React Three Fiber and I’m thinking of adding a feature where the client can toggle lights under some furniture—like under bed tables, for example. I’ve been brainstorming a lot but still haven’t found a solid solution. Baking the light doesn’t really work since I’m also planning a day/night cycle, and the baked lighting wouldn’t respond dynamically to that. I thought maybe there could be some clever baking tricks, but I’m not sure. I also considered making the light animated—like RGB keyboard effects—but again, I’m not sure what’s the best approach here. How would you go about solving this?

I don’t know the goal, just tried to play with emissive color/map.


Demo: https://codepen.io/prisoner849/full/OPPrJMp

4 Likes

And something related: LED panel (UnrealBloom as lightMap)

3 Likes

Thanks @prisoner849 a lot for taking the time to answer!

Now about the main goal—it’s to achieve something similar to LED lighting under the bed or under a gaming table. The light shouldn’t just have an emissive glow; it should actually illuminate the space around and beneath it. For example, even in a completely dark room (like during the night cycle), the LED light should make the area under the furniture clearly visible.

I tried using a RectAreaLight, and while the result wasn’t bad—it does cast some nice soft light—I’m still looking for a solution that can feel a bit more intense and focused, like a real LED strip. I’m also interested in possibly adding RGB-style effects, like subtle color cycling or breathing animations.

If you have any ideas or tips on how to get even closer to that kind of effect.

something like this

or

or spot with texture

or also plane with emmisive texture

1 Like

Well… Something of patches of patches.

Demo: https://codepen.io/prisoner849/full/xbbMxEB

that would help, thanks a lot <3

Hello again,
i have a question if you may,
I’m trying to use the shadow texture produced by a directional light as an emissive map—not just on a plane, but on arbitrary shapes. In my current code, you manually draw to a canvas texture and apply it to a plane as an emissive map. However, I realize this doesn’t scale well to more complex geometry. Since the directional light already generates a depth texture for shadows, is there a way to access and slightly modify that shadow texture to use it as an emissive map on any mesh? I’d appreciate any guidance on how to approach this properly.