Skip to content

Swiftner/swift-loop

Swift Loop

Turn one shape into a hundred. In Figma. While you drag.

Swift Loop is a Figma plugin for making patterns. Spirals, grids, waves, phyllotaxis, halftone, hex tiles, basically anything you can describe with a little math. Pick a shape, pick a pattern, drag a slider, and watch it bloom in real time.

You can play with it right now, no Figma required:

Live preview in your browser

Or jump straight to the real thing:

Install in Figma

Why another loop plugin?

Because the original Looper was lovely, and it's been quiet for a while. The Figma Plugin API has moved on, dynamic-page is the new normal, and there were a few things we kept wishing for:

A live preview that re-renders as you drag, so you're not stuck in a "Generate, undo, try again" loop.

Grids, not just chains. Set cols × rows and watch your shape tile.

Spirals without a math degree. A Spiral ramp curls a line into a spiral or swirls a grid, no formula required — and because it's a ramp you can make the curl tighten along the loop.

A formula library with 38 patterns to start from, browsable right in the UI.

Custom formulas for when a slider won't cut it. Drop into fx mode and write the math yourself.

Same spirit as Looper. New engine underneath.

Install

The easy way:

  1. Grab the latest swift-loop-vX.Y.Z.zip from the Releases page.
  2. Unzip it somewhere safe.
  3. In Figma desktop, go to Plugins, Development, Import plugin from manifest…, and pick the manifest.json you just unzipped.

That's it. The plugin lives in your Plugins, Development menu from now on.

If you'd rather build from source:

git clone https://github.com/Swiftner/swift-loop.git
cd swift-loop
bun install
bun run build

Then do the same Figma import step on the cloned folder's manifest.json.

Penpot

Swift Loop also builds as a Penpot plugin from the same source — the engine, UI, and pattern library are shared; only a thin host adapter differs.

bun run build:penpot

This emits build/penpot/ (manifest.json, plugin.js, ui.html, ui.js). Serve that folder over HTTP and load the manifest.json URL from Penpot's plugin manager. A prebuilt swift-loop-penpot-vX.Y.Z.zip is also attached to each release — unzip, serve, and load the manifest the same way.

Note: verified in a self-hosted Penpot 2.15 instance — the UI↔plugin bridge and rotation behave correctly. It's a newer target than the Figma build, so if something looks off on a different Penpot version, please open an issue.

Using it

Pick something on your canvas. A Vector, a Shape, some Text, a Group, whatever you've got.

Run Plugins, Development, Swift Loop.

Set columns and rows. Leave rows at 1 if you want a line. Crank both if you want a grid. Bump the Angle slider a few degrees and the line curls into a spiral, the grid swirls.

Drag X, Y, rotation, scale, opacity. The preview updates as you go.

Want chaos? Open Modulation for randomness and sine waves.

Want a head start? Hit a Preset or browse the Library.

When you're happy, click Generate to commit it to the canvas. Undo always works, so iterate freely.

The Library

38 patterns ship with the plugin:

Brick, Checker, Comet, Concentric Squares, Confetti, Cube, Curl, Cylinder, Damped Wave, Diamond, Fountain, Grid, Halftone, Heart, Helix, Hex Tile, Isometric, Lissajous, Mandala, Phyllotaxis, Pinwheel, Polar Grid, Radial Burst, Ribbon, Ring Tunnel, Ripple, Rose, Sphere, Spiral, Spiral Tower, Square Spiral, Starburst, Torus, Truchet, Vortex, Wave, Wave Field, Whirl.

Each one is a tiny JSON file in library/ with the formulas inline. No code, no rebuild, just the math. If you want to add your own, it's one file and one PR. See CONTRIBUTING.md for the schema.

Docs

If you want the full tour:

And one for the robots:

Custom formulas

Click the fx pill in the top-right of the UI and each property turns into a math expression you can edit live:

x        = cos(t * TAU) * 200
y        = sin(t * TAU) * 200
rotation = t * 360
scale    = 0.4 + 0.6 * sin(t * PI)

You can use: i (index), n (total), c (column), r (row), l (layer), cols, rows, layers, t (0 to 1), tx, ty, tz (0 to 1 across layers), w, h, seed.

Functions: sin, cos, tan, asin, acos, atan, atan2, sqrt, pow, exp, log, abs, min, max, floor, ceil, round, mod, rand().

Constants: PI, E, TAU.

If you've used Desmos or written a shader, you already know the dialect.

Contributing

PRs welcome. Patterns especially. If you've got a layout you keep redrawing by hand, that's a contribution waiting to happen. See CONTRIBUTING.md.

License

ISC. Fork it, ship it, sell it. Just keep the credit line.

Credits

Standing on shoulders:

Looper by Kuldar Kalvik, the original, and still a great idea.

Looper Legacy, a fork by Stas Haas that kept it alive.

Swift Loop, modernized, gridded, and formula-fied by Swiftner.

About

Turn one shape into a hundred. A Figma plugin for spirals, grids, waves, and anything you can describe with a little math. Modernized fork of Looper.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Packages

 
 
 

Contributors