Hero made by @ybouane.

@crazygl/hero-neon-fluid

GPU Eulerian fluid simulation (Stam 1999). Advected dye + velocity ping-pong textures with a Jacobi pressure solve give true divergence-free flow. Drag to inject momentum and colour; additive bloom on the dye field paints glowing smoke through the void.

Demo

Neon Fluid

Install

npm install @crazygl/hero-neon-fluid

Usage

import NeonFluid from '@crazygl/hero-neon-fluid';

export default function Page() {
  return (
    <NeonFluid
      colorA="#ff2d8a"
      colorB="#5cf2ff"
      colorC="#a26cff"
      glow={1.2}
    />
  );
}

Customise

• Style — backgroundColor, the three-stop ink palette colorA/colorB/colorC, glow (bloom), and exposure (tonemap).
• Simulation — flowSpeed, dyeDissipation (how long colour lingers), velocityDissipation (how long momentum lingers), and ambientStir (idle background currents).
• Pointer — splatForce (momentum a drag injects) and splatRadius (stroke size).

Best for

• AI and creative-tool launch pages that want a living, generative feel
• Premium, dark, cinematic product and brand sites
• Music, nightlife, and event landing pages
• Interactive portfolio and agency hero sections

This hero is part of CrazyGL, a collection of production-ready WebGL, canvas, 3D, and typography effects. Every CrazyGL hero ships with an agent-ready SKILL.md file that helps developers and coding agents adapt the effect into custom landing pages and interactive experiences.