Prismatic Bloom is an airy WebGL sculpture woven from silver filaments, with breathing folds, an iridescent sheen and a soft response to the pointer. Use it as an elegant hero centrepiece or an interactive section background. Filament density and opacity set the weave, fold depth and surface motion shape the sculpture, and silk sheen and iridescence control its colour play. Motion speed, zoom, pointer response and palette are editable live, and the code exports use the same original renderer.
How this shader works
Prismatic Bloom is an airy sculpture woven from silver filaments, with breathing folds, an iridescent sheen and a soft response to the pointer. It works as a hero centrepiece or an interactive section background. Filament density and Filament opacity set the weave, Fold depth and Surface motion shape the sculpture, and Silk sheen and Iridescence control its colour play.
Tips
- Filament opacity sets how see-through the weave is. Lower it for a lighter, more delicate sculpture.
- Set Pointer response to 0 if the sculpture should ignore the mouse.
- Surface motion controls how much the folds breathe, separately from Motion speed.
- Change Iridescent tint to shift the colour of the sheen.
Questions
How do I make an interactive 3D-looking hero that reacts to the mouse?
Open Prismatic Bloom and raise Pointer response so the folds move with the cursor. Set Zoom to frame the sculpture, then export it as an HTML file or a React or Svelte component.
How do I make it less colourful?
Lower Iridescence and Silk sheen. The filaments then read as plain silver.
Preview and customize in the browser. Exports require membership.