Built with Rive

Retro Neon Sign Effect with Rive

Ana Catita

On this project, I aimed to closely replicate the look and feel of a retro neon sign by exploring Rive's new feathering feature.
My goal was to push this capability to its limits, layering multiple glow and blur effects to achieve a highly realistic yet lightweight result.
First I made a ruff sketch of my neon concept
First I made a ruff sketch of my neon concept
Secondly I cleaned up the main draft and added a second variation for the overlapping neon animation
Secondly I cleaned up the main draft and added a second variation for the overlapping neon animation
Finally, I brought everything together in Rive. Each stroke of the neon was carefully adjusted with multiple feather effects to simulate the primary color, inline and outline glows, and subtle shadows.
I also incorporated light flares and random secondary opacity shifts to enhance the broken neon effect, giving the entire piece a more authentic and dynamic feel.
Now you can check for yourself and play with the Rive file directly on the browser!
Hope you enjoyed this project and for any inquiries don't hesitate contacting me :D
Like this project

Posted May 15, 2025

Realistic retro neon sign effect using Rive's feathering feature.

Micro Animations
Micro Animations
UI/UX Progress Bars
UI/UX Progress Bars
Eco-Friendly Home (Rive)
Eco-Friendly Home (Rive)
X-mas ride
X-mas ride

Join 50k+ companies and 1M+ independents

Contra Logo

© 2025 Contra.Work Inc