How Spiral Art Is Generated

Spiral art looks complex, but it is built from a surprisingly simple mathematical recipe. Every artwork in the Espiralito gallery is produced by placing shapes along a spiral path, then applying symmetry, color, and effects. Here is how it works, step by step.

Step 1: The Spiral Path

A spiral is a curve that winds around a central point while moving away from it. The simplest way to generate one is to place points at increasing distances from the center while rotating by a fixed angle each step.

For each element index i, the position is calculated as:

• Radius: r = i × spacing × scale
• Angle: θ = i × 15° + (time × speed)
• X position: x = centerX + r × cos(θ)
• Y position: y = centerY + r × sin(θ)

The spacing parameter controls how far apart consecutive elements are. The scale parameter multiplies the radius, controlling the overall size of the spiral. The constant 15° per element determines how tightly the spiral winds.

Step 2: The Elements

At each point along the spiral, the generator draws a shape. Espiralito supports seven shapes: circles, squares, triangles, pentagons, hexagons, stars, and diamonds. The count parameter determines how many shapes appear, and the line width controls their stroke thickness.

Each shape's size grows with its distance from the center — the outer elements are larger than the inner ones. This creates the characteristic tapering look of spiral art.

Step 3: Rotational Symmetry

Symmetry is where spiral art becomes spectacular. With n-fold symmetry, the entire spiral arm is duplicated n times, each copy rotated by 360° / n around the center.

With symmetry set to 1, you get a single flowing spiral. With symmetry set to 8, the arm is repeated eight times, creating a mandala-like rosette. High symmetry values (8–16) produce the intricate, kaleidoscopic patterns that make spiral art so distinctive.

Step 4: Color

Color is assigned algorithmically based on each element's position along the spiral. Different palette types use different rules:

• Rainbow — hue rotates continuously through the spectrum
• Monochromatic — a single hue with varying lightness
• Complementary — two opposite hues alternate
• Custom gradients — colors interpolate through hand-picked stops

Because color depends on position, the palette and the spiral geometry interact: change the spacing and the color bands shift, even with the same palette.

Step 5: Effects

Effects are mathematical transformations applied on top of the base spiral:

• 3D depth — applies perspective projection and rotation, making the spiral appear to tilt in space
• Pulse — modulates the size of elements over time
• Wave — shifts the spiral's center vertically in a sine wave
• Twist — warps each element's angle based on its radius
• Morph — changes the shape type along the spiral (circles become pentagons, then stars)
• Dynamic — adds noise-based variation to the radius for organic movement

Step 6: The Seed

The seed is a single number that initializes the pseudorandom number generator. This PRNG produces the noise that adds organic variation to the spiral's radius. Because the PRNG is deterministic, the same seed always produces the same noise — and therefore the same artwork.

This is why the generator's share URLs work: the URL encodes the seed and all parameters, so the artwork can be recreated exactly, on any device, at any time.

See It in Action

Open the spiral art generator and experiment. Change the symmetry slider from 1 to 8 and watch the pattern transform. Increase the count and see the spiral fill with detail. Each parameter is a direct handle on the mathematics.