Skip to content

Chladni Plate

A metal plate shaken at the pitch of a note, sand running into fine lines and lattices, then thrown and settling into the next figure. Loops perfectly.

Background, V1 Effects3DSeamless loop, verified548 lines of codev1.0.0

In Science & maths, Music & sound, Patterns & illusions

Next: Faraday WaveSurprise me

Chladni Plate preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

Your current settings go with it. Combine several clips and hand them over together from your sequence.

Effect controls

Presets

3

How many different notes (figures) one loop holds.

3

How fine the figures are: higher notes draw more lines.

26000

The number of grains: finer figures need more.

1
1

How wide the bands of sand are round the lines.

1

How violently the sand is thrown between figures.

0.6

How much the metal shimmers with the vibration.

7

The preview runs the same code your AI receives. These settings travel with the hand-off.

Info

What it is

The classic experiment of Ernst Chladni, as a quietly hypnotic loop: a square brass (or steel, or copper) plate lies under a soft sliding light, clamped by a bolt at its middle. Each note it is shaken at makes the plate move in some places and stand still along lines; the sand on it runs from the moving places to the still ones and draws the figure. Every few seconds the note changes: the plate is shaken hard, the sand is thrown across it and runs again into a new, more or less intricate figure of lines, crossings and lattices, until the loop comes back to the first. Choose the look (brass, steel, copper or glowing neon sand), how many figures a loop holds, how intricate they are, how much sand there is and how big its grains, how wide the bands are, how violently it is thrown, how much the metal shimmers and the seed that picks the figures.

Reuse it in your own idea

  • Ambient music backdrop: Brass plate, three figures.
  • Physics explainer on resonance: Salt on steel.
  • Sound or tech title: Glowing neon sand.

Which part is reusable

src/chladni-plate.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses the demo harness only for the demo.

Good to know

  • The figures are the ideal modes of a plate (cosines), not a simulation of a real clamped plate.
  • The sand is drawn as round points a few pixels wide, so very high intricacy with little sand looks sparse: raise the sand with the intricacy.
  • The transitions (sand in the air, lines forming) are the costly frames to encode: a loop with more figures or much more sand makes a much larger video.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/chladni-plate.js
Exports
  • createChladniPlate({ look?, modes?, order?, grains?, grainSize?, spread?, shake?, shimmer?, seed? }) => { scene, camera, sequence, setSize(width, height), update(time, loopSeconds), dispose() }
  • createBloomPass(renderer, { width, height, glow?, exposure?, grain? }) => { render(scene, camera, output?), dispose() }
  • planModes({ count?, order?, seed? }) => [n, m, sign][]
  • LOOKS: { brass, steel, copper, neon }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, the plate shader, the sand points and the bloom targets.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: The plate is a square centred on the frame, 86 % of its height wide, with coordinates 0 … 1 across; the bolt is at its middle. Each figure is the zero set of cos(nπx)cos(mπy) + s·cos(mπx)cos(nπy).

Lighting: Self-lit: a soft light from the upper left with a band of light that slides over the brushed metal once per loop; the neon look glows and blooms.

Timing: update(time, loopSeconds) sets the loop phase; frames render in any order.

Output
1080×1080, 30 fps, 15 s · procedural (computed from the frame number) · seamless loop — Each figure owns an equal share of the loop; every grain's place is a formula of the position in the loop (its walk to the nearest line is a fixed number of steps), the hop of the grains is a sine of whole cycles per loop and the light slides as a sine of the loop, so the last frame meets the first.
Tested
Rendered 450 frames on 2026-10-06 in Chrome 154.0.8037.97 headless on Linux 7.0.0-38-generic (x64), Node 22.14.0 (WebGL 2 via SwiftShader (software)). Same frame twice from fresh pages: identical. Loop: Frame 0 vs end state (progress 1): mean |Δ| 0.0000, max |Δ| 0 of 255.
Performance
One full-screen pass for the plate and 26 000 sand points, each walking 20 steps in its vertex shader, then a small bloom. About 7 ms a frame at 1080p on an integrated Intel GPU. Software WebGL (no GPU) renders in a second or so a frame; more than about 100 000 grains costs more than it shows.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- chladni-plate/1.0.0 --out my-video.mp4Needs Node 18+, ffmpeg and Chrome/Chromium. Add --params my-settings.json (from Copy settings) for your own settings.
Version
1.0.0 · sha256:5fe5b44a93067851…
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. License details
Provenance
Adapted from the owner's threejs-sketches/audio-musical/webgpu-chladni-plate and physics-simulation/chladni-patterns (MIT) and rebuilt for AI Pixel Wizard in October 2026 as an original scene: every grain's place a formula of the time (no particle simulation), figures chosen and sequenced by a seed, an exact loop, a bolted brushed-metal plate and the frame/time contract.
BinMore like this

Bass Pulse

Background3DSeamless loop8 seconds