Experimental • Three.js / R3F

Interactive 3D

Six experimental scenes built entirely in code with React Three Fiber. No external 3D models, no Spline — just math, physics, and thousands of particles. Move your cursor to interact.

Loading scene...
Scene 1

Gravity Well

Black Hole Cursor

4,000 particles orbit in space. Move your cursor to create a gravitational singularity — particles spaghettify, glow hot orange, and get consumed. They respawn at the edge of the accretion disc.

InstancedMesh • Gravity Physics • Color Heat Map
Loading scene...
Scene 2

Swarm Intelligence

Morphing Collective

3,000 boids auto-morph between a sphere, DNA double helix, torus knot, and infinity sign every 4 seconds. Cursor repels nearby particles. Each transition uses cubic ease-out interpolation.

Boid Flocking • Shape Morphing • Golden Angle Distribution
Loading scene...
Scene 3

Sound Fabric

Rippling Mesh Surface

A 6,400-vertex wireframe mesh that responds to your cursor like a liquid surface. Move to create ripples. Click for shockwaves. Multiple ripples interfere and decay naturally.

BufferGeometry • Wave Propagation • Vertex Normals
Loading scene...
Scene 4

Living Trail

Cursor Sculpture

Your mouse movements leave behind permanent crystalline geometry that breathes and drifts. Each point inherits cursor velocity and slowly settles into a floating sculpture. Up to 2,000 dodecahedrons.

Dodecahedron Instancing • Velocity Inheritance • HSL Color
Loading scene...
Scene 5

Dimensional Rift

Portal Wormhole

40 concentric rings of particles form a tunnel through spacetime. Hover to warp the entrance — inner rings accelerate, wobble, and pull toward your cursor. 2,400 particles total.

Ring Topology • Warp Drive Physics • Depth Gradient
Loading scene...
Scene 6

Magnetic Fluid

Ferrofluid Simulation

2,500 metallic spikes arranged in a sunflower pattern on a reflective disc. Hover to simulate a magnetic field — spikes rise, lean toward cursor, and pulse. Real ferrofluid dynamics.

Sunflower Phyllotaxis • Magnetic Field • PBR Metallic

Use Any Scene

import { GravityWell } from "@/components/three/experimental/gravity-well"
import { SwarmIntelligence } from "@/components/three/experimental/swarm-intelligence"
import { SoundFabric } from "@/components/three/experimental/sound-fabric"
import { LivingTrail } from "@/components/three/experimental/living-trail"
import { DimensionalRift } from "@/components/three/experimental/dimensional-rift"
import { MagneticFluid } from "@/components/three/experimental/magnetic-fluid"

// Drop into any page — each scene is self-contained
<GravityWell className="w-full h-[600px]" />
<SwarmIntelligence className="w-full h-[600px]" />
<MagneticFluid className="w-full h-[600px]" />