We are live on DevHunt: tool of the week contest

check it out

Particle Vortex

SVG particles that gravitationally react to mouse movement.

Preview

Interactive Preview

gravity.OS

Quantum particle simulation v2.0

repel.OS

Quantum particle simulation v2.0

drift.OS

Quantum particle simulation v2.0

Installation

Usage

tsx
import { ParticleVortex } from "@/components/block/particle-vortex"

export default function Demo() {
  return (
    <div className="flex flex-col gap-8">
      <ParticleVortex variant="gravity" count={150} />
      <ParticleVortex variant="repel" />
    </div>
  )
}

Dependencies

framer-motion

Props

PropTypeDefault
countnumber100
variant
"gravity""repel""drift"
gravity