Ferrofluid

Ferrofluid is oil full of tiny iron particles. Bring a magnet close and it stands up in spikes, a hedgehog of black glass that follows the magnet around. Here the dish sits under a studio light and your pointer is the magnet. Press to pull harder, add a second or third magnet that wanders on its own, or switch the beat on and watch the spikes jump to the kick.

How it works

The whole dish is one fragment shader. Each magnet raises a soft mound in the surface, and where the field is strong enough the mound breaks into a hexagonal field of spikes, taller the closer they are to the magnet, just like the real thing. The spikes follow a slower copy of the magnet than the mound does, so they lag behind and catch up like liquid. Almost everything you see is reflection: the liquid is shaded as a black mirror that reflects light boxes overhead, so the spikes read from their bright rims and glints. Four lights change the mood, from a cool studio to a warm or club light.

The sound is synthesised: the low hum of an electromagnet that swells with the field, a wet crackle while the spikes move, and an optional beat.

Built with

• A WebGL2 fragment shader: height field, hexagonal spike lattice, mirror shading
• Web Audio API for the hum, crackle and beat
• Astro and TypeScript, no images or audio files