Draw your name. Drop the fast circles, and it melts.

Scribble your name on the canvas and let go. A swarm of nested circles springs up, each one spinning at its own speed, and the tip of the smallest traces your handwriting back out, stroke for stroke. Then drag the Circles slider down and watch it fall apart: the crisp letters slump into a loose, wobbly ghost of themselves, and you can see exactly which circles were carrying the detail.

Epicycle is the "spinning circles draw a picture" demo popularized by 3Blue1Brown, made hands-on. Almost every version online retraces a hardcoded Homer Simpson or a pre-baked SVG. This one retraces your shape, computed live in the browser, and lets you take it apart.

A drawing is a sum of rotating vectors

Here is the idea the whole thing rests on. Treat your drawing as a moving point: as your finger travels the path, its position at time t is a complex number, x + iy. Sample that path at N evenly spaced points and you have a periodic function, and any periodic function is a sum of pure rotations at whole-number frequencies. Finding the amplitude and starting angle of each of those rotations is exactly what the discrete Fourier transform does.

So Epicycle's pipeline is short. Capture the freehand stroke as points. Resample it to a fixed count of evenly spaced points along the arc, so a slow, careful curve and a fast flick both get sampled fairly. Run the DFT. Out comes a list of frequencies, each with an amplitude (how big its circle is) and a phase (where it starts). Stack them tip to tail, spin each at its frequency, and the end of the chain draws your path.

The Circles slider is where the math turns into intuition. Each circle is one frequency. The big slow ones rough out the overall shape; the tiny fast ones add the sharp corners and fine wiggles. Keep only the largest handful of amplitudes and you are literally throwing away the high-frequency detail, which is why the trace melts into a smooth wobble instead of just getting choppy. That is Fourier compression, and you are watching it happen in real time.

Ptolemy had the picture, Fourier had the proof

The word "epicycle" is not from math class. It is from ancient astronomy. To explain why planets sometimes appear to loop backward across the sky, Ptolemy built a model of circles riding on circles: a big orbit (the deferent) carrying a smaller one (the epicycle), stacked to match the wandering. It was a geocentric fudge, and Kepler's ellipses eventually retired it. The quiet joke is that Ptolemy was not wrong about the mechanism, only the astronomy. Circles-on-circles really can reproduce any closed path you like; you just need the right ones and enough of them, which is precisely what the Fourier transform hands you. Epicycle is that fourteen-centuries-old picture with the coefficients finally computed correctly.

One deliberately unfashionable decision under the hood: the transform is a direct O(N²) DFT, not an FFT. A hand-drawn stroke needs only a few hundred sample points, and at that size the naive double loop finishes in well under a single frame, so the FFT's speedup buys nothing and costs clarity. The plain version is a handful of lines you can read, and it round-trips against its own tests: transform a path, invert it, and you should get the path back. When the whole app is static ES modules with no build step, code you can verify by eye is worth more than code that is fast for inputs you will never feed it.

Try it

Open Epicycle and draw anything closed, your name, a heart, a spiral. Within a second or two the circle chain assembles and starts retracing it. Drag the Circles slider to trade fidelity for wobble, slow the playback down to watch a single circle's contribution, or hit a preset if you would rather not draw. When you get a frame you like, export a PNG or a WebM of one full loop. No login, no upload; the drawing and the math both stay in your browser.