Generate spirograph patterns with adjustable ring, wheel, and pen position parameters.
This tool draws the curve a spirograph toy makes: a small wheel rolling inside a larger ring, with a pen poking through the wheel. You enter three numbers - ring radius, wheel radius, and pen offset - and it plots the resulting pattern, closed and centered, so you can adjust the geometry until the figure matches what you have in mind. The common misreading: the petal count is set by the ratio of ring to wheel, not by either size alone, and a pen set beyond the wheel rim makes the curve cross itself, which surprises people expecting a clean star.
A concrete input and expected output from the current implementation.
Input
ring 96, wheel 45, pen 30
Expected output
A closed rosette of 32 smooth, rounded lobes that stays inside the ring: the curve's radius swings between 21 and 81 units on a 96-unit ring, so it never touches the ring edge or the center.
The ratio 96:45 reduces to 32:15, so the trace closes after 15 wheel rotations and shows 32 lobes. The pen at 30 sits inside the wheel radius of 45, which rounds the lobes; a pen at 45 would turn them into sharp cusps.
The pattern is a hypotrochoid: the wheel center orbits the ring center at radius R - r while the pen swings around the wheel center at radius d. Closure depends on the ratio R/r: reduced to lowest terms p/q, the closed curve has p lobes and takes q rotations of the wheel around the ring. The renderer samples points along that parametric curve and joins them into the drawn line.
Ring radius sets the overall scale and the denominator of the ratio. Wheel radius sets the ratio and therefore the petal count: with the ring fixed, a larger wheel gives fewer lobes. Pen offset shapes each lobe: inside the wheel (d < r) gives rounded curves, exactly on the rim (d = r) gives sharp cusps, and beyond the rim (d > r) gives self-crossing loops that reach outside the ring.
The ratio of ring radius to wheel radius. Reduce it to lowest terms and the numerator is the petal count: ring 96 with wheel 45 gives 96:45 = 32:15, so 32 petals, reached after 15 rotations of the wheel. The pen offset changes each petal's shape - rounded, pointed, or looped - but never the count.
With whole-number inputs the ratio is rational, so the curve always closes in principle - but slowly for near-1 ratios: 96 and 95 need 95 wheel rotations, so such a pattern can look unfinished. Choose a ratio that reduces to a small fraction and it closes within a few rotations. Irrational ratios never close.
The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Pick colors visually and convert between HEX, RGB, HSL, and CMYK formats.
Preview how screen colors translate to print with CMYK simulation and proofing.
Preview any Google Font at various sizes, weights, and with custom sample text.
Create linear, radial, and conic CSS gradients with a visual editor and code output.
Generate harmonious color palettes from a base color using color theory rules.
Simulate how colors appear to people with various types of color vision deficiency.