Hero made by @ybouane.

@crazygl/hero-vortex-particle-sphere

Thousands of small white dots are spread evenly over a sphere with a Fibonacci spiral, then a vortex field swirls and pulls them toward a focal point — they spiral, streak, and bunch up like matter falling into an accretion disc. Crisp, monochrome, and scientific on pure black.

Demo

Vortex Particle Sphere

Install

npm install @crazygl/hero-vortex-particle-sphere

Usage

import VortexParticleSphere from '@crazygl/hero-vortex-particle-sphere';

export default function Page() {
  return (
    <VortexParticleSphere
      particleCount={6000}
      vortexStrength={0.23}
      dotColor="#e8e8ec"
    />
  );
}

Customise

• Particles — particleCount, pointSize, dotColor.
• Motion — rotateSpeed (sphere spin), vortexStrength (pull/streak), vortexTightness (funnel focus).
• Look — glow (additive halo), pointerGlow (cursor lens), sphereScale, positionX (shift so copy sits beside the sphere).
• Backdrop — transparent and backgroundColor.

Best for

• Quantitative finance, trading, and fintech sites that want a "data has gravity" feel.
• AI and machine-learning launch pages.
• Deep-tech, research, and scientific-computing brands.
• Premium product pages that need a calm, intelligent hero.

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.