Create a Sparkle effect (with threeshod)

Hi all,

I’m trying to find a way to create sparkle effect on a render. The idea is, like for bloom pass, to be able to add an effect that create random sized sparkles on the more brighting pixel like on jewel or glitter video effect when you move your model.
This is an example of the idea :
https://www.dmia.net/wp-content/uploads/diamond-sparkle.jpg
I’m sorry but didn’t found any example of this kind of effect with three js on the web.
The questions i’m wondering are :

  • how to detect more brithning pixel ?
  • how to design a star effect on this pixel

I’m looking for an example to help me to start this effect.

Thanks a lot.
Have a good day !

Would a lensflare effect be helpful for your use case? There is an official example that demonstrates the usage of the Lensflare class:

https://threejs.org/examples/webgl_lensflares

Hi Mugen,

Thanks for your response. That’s not exactly what i’m trying to produce. The idea is to automatically create Spakles on pixel that is the more brighting.
I created a picture to illustrate the concept :

Thanks again for your help !

1 Like

According to photoshop all pixels within the marked regions have the same color / brightness though - you’d get a lot of sparkles:

Nevertheless, you could still write a custom postprocessing that adds sparkles in the brightest spots on the screen (based on some pixel average around a region.) All it would require is applying a horizontal / vertical / diagonal blur in the right places.

Thanks, i’ll try it and come back ! Do you have an start example on how to detect the more brightness pixel ?