Neon Rupture

Standalone WebGL visual prototype with a built-in admin panel for switching presets and tuning the effect live.

Live demo: proto.lucidity.design/sites/Neon-Rupture

Files

• index.html: canvas mount and admin panel
• css/main.css: full-screen layout and panel styling
• js/bundle.js: bundled WebGL effect runtime
• cover.png: preview image

Run locally

This is a static prototype with no build step. You can open it directly in a browser:

open index.html

If the browser blocks local asset access, serve the folder with any static file server:

python3 -m http.server 8080

Then open http://localhost:8080.

Presets

The effect includes these built-in presets:

• Solar Flare: #ff3c3c to #5a008c
• Aqua Rupture: #00fff0 to #7700ff
• Acid Sunset: #d6ff00 to #ff5e00
• Ice Vein: #9ae7ff to #1f6bff
• Magma Bloom: #ff7a18 to #ff006a
• Ghost Signal: #f4f7ff to #70ffd8

Admin panel

The on-page panel can be collapsed and lets you:

• switch presets without reloading
• edit the two effect colors directly
• edit the background color
• adjust effect scale
• adjust animation speed
• adjust rotation speed
• toggle mouse orbit
• reset the camera view
• minimize the panel

The selected preset and control values are stored in localStorage.