Neon shader demo

Here is my first project, an attempt to create a neon effect with a shader. The demo is based on the work of many other people:

The demo is available here (with animations and sound effect):

Click on the switch to turn on/off the neon.

With the inspector, you can modify certain properties to change the appearance of the neon, such as the x/y/z orientation and the boundary between the rear neon part (in black) and the frond one, change the color or even the smooth effect between the inner and the outer color of the tube:

The default “style”:

A darkest green neon:

Front/back boundary examples:

And a red and yellow neon:

It’s certainly not the best neon effect (and probably not the best way to do it), but for a beginner, working on this demo was a great way to learn a lot about BabylonJs. But BabylonJs has so many features that now … I’m still a beginner! :grinning: So, any comment or advice on this demo will be greatly appreciated!


@LeJohn : very very nice (from someone who actually has watched that lengthy Blender Guru tutorial) :smile:

Thanks ! :smile:

@LeJohn : No problem - I appreciate all of the complexity in that tutorial. And I created this a while back :

The Office

No animation or switch - unlike your great work.

Stay Safe, gryff :slight_smile:


@gryff: I really like the atmosphere, it’s very nice! Thank you for sharing it.