Spirograph - Hypotrochoid Pattern Generator (2D)
Interactive 2D spirograph: a fixed outer ring and a rolling inner circle trace a real hypotrochoid or epitrochoid curve on canvas, with visible rotating gears, a live pen tip, and a numeric readout of the curve's mathematical properties as it draws.
This 2D companion runs the exact same hypotrochoid mathematics as the 3D version — x=(R−r)cosθ+d·cos(kθ), y=(R−r)sinθ−d·sin(kθ), k=(R−r)/r — but reads more like a real spirograph toy: the fixed outer ring and rolling inner circle are drawn to scale and genuinely rotate at the correct ratio each frame, a white pen tip marks the exact point being plotted, and a side panel reports the curve's live mathematical characteristics (the ratio k, the number of cusps, how many revolutions of the inner circle it takes for the pattern to close, and the pen's instantaneous speed) as the trail accumulates. Switching to epitrochoid mode rolls the small circle around the outside of the fixed ring instead of inside it, changing the curve family entirely while using the same three radius/offset sliders.
Interactive 2D spirograph: drag the outer-radius, inner-radius, pen-offset and speed sliders to trace real hypotrochoid and epitrochoid curves, with a live rotating-gear overlay and a numeric readout of cusp count, closure period and pen speed.
2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install