Knights · gallery & field notes

This article contains a large amount of Claude verbiage. I've edited it quite a bit and tried to remove the more obvious examples of Slop, but many of the descriptions of the visuals come from Claude which does a decent enough job.

Knights replays the turn-based solve of a spiral knight-coloring — the phenomenon from Numberphile's Red & Black Knights (Neil Sloane), with more in the Numberphile2 follow-up — then accelerates and zooms out to reveal the emergent large-scale pattern. Cells of a square spiral are claimed by K colors of pieces taking turns; on a color's turn it grabs the lowest-numbered cell that is not occupied and not attacked by any other color (same-color attacks are allowed — that asymmetry is what breeds the pattern). Controls and URL params are in the README; design notes in ideas.md.

Each pattern below has one-click live links — the solve is deterministic, so the URL reproduces the exact field. Where a detail needed a crop, the tools/shot.mjs command (with its coordinates) is included too.

Basics

The original result: just two knights taking turns, each avoiding the cells the other attacks. That alone produces the famous pattern — see the Numberphile videos linked above. More colors and odder pieces build from this.

Red & Black — two knights

knight ×2  ·  Mono palette

Two-tone knight pattern: nested concentric square frames with cross-shaped channels radiating from the center.
The original two-color result. Out of one simple rule comes this nested, self-similar structure of concentric frames and channels radiating from the center — and look closely: a few tiny island anomalies already appear.

live (plays the build; press S for the finished view)

Three colors

knight ×3  ·  Vivid palette

Three-color knight pattern: large solid wedge domains meeting at the center with striped transition zones.
Add a third knight and the field breaks into big solid wedge domains that meet at the center in finely-striped seams — same rule, one more color, a very different character.

live (plays the build; press S for the finished view)

More from the videos

The Numberphile2 follow-up runs through other pieces and mixes. Here they are — one click to watch each one build (in every case each color is a single piece type, just like the videos):

4 knightslive
5 knightslive
alfil + three-leaperlive
knight + antelopelive
knight + dabbaba + wazir ×2live
knight + zebralive
wazir, ferz, wazir, ferzlive

Compound pieces

We've also added compound pieces — a single color that moves as the union of several leapers at once. A knight+antelope compound may step like a knight or an antelope on any given move (the standard fairy-chess reading — an OR of the moves, not a sequence). In the videos each color is always a single piece type.

Several of these unions are named fairy pieces — the compound editor recreates them (then keeps going into unnamed unions like knight+antelope):

Mann/ commoner — wazir + ferz, the non-royal kinglive
Kirin— ferz + dabbaba (also preset 4, ×8)live
Phoenix— wazir + alfillive
Alibi— dabbaba + alfillive
Squirrel— knight + dabbaba + alfil, every cell two awaylive
Frog— ferz + three-leaperlive (×3) live (×5)

Rider-based compounds like the Amazon (queen + knight) aren't reachable — this sketch has only leapers, no sliding pieces. Beyond the named ones, mixing different reaches into one piece is what breeds the wilder fields below.

Interesting combinations

Rose window — a calm pinwheel in a busy frame

wazir+ferz ×4  +  knight+antelope ×4  ·  Vivid palette

Pairing four king colors (wazir+ferz, which cover every near neighbor and so build big coherent domains) with four knight+antelope colors (two reaches at once, which can't settle) splits the field cleanly: the king colors win the calm geometric pinwheel at the center, and the restless knight+antelope colors are pushed out into an ornate, carnival-like frame. The character holds at every zoom — only the core-to-frame ratio shifts.

Extent 300: a bold pinwheel of flat triangular sectors fills the center, ringed by a dense border of tiny colored triangles.
Extent 300 — the pinwheel core dominates.
live (300)
Extent 500: a smaller central pinwheel inside a larger busy mosaic frame.
Extent 500 — core and frame in balance.
live (500)
Extent 1000: a small ordered pinwheel jewel at the center of a vast busy mosaic field.
Extent 1000 — a small jewel in a vast field.
live (1000)

Chrysanthemum — a busy core in a calm frame

wazir+ferz ×4  +  zebra ×4  ·  Vivid palette  ·  extent 300

A pinwheel of large flat color sectors radiating outward from a turbulent dithered bloom at the very center, with feathery plumes.
Big clean radial sectors around a turbulent speckled bloom at the center — a chrysanthemum, or a firework caught mid-burst.

Same king colors (wazir+ferz) as the rose window, but paired with a single long-reach piece (zebra) instead of the knight+antelope compound. A pure long-reach piece can't build domains of its own, so rather than forming an outer frame it dumps all its interference at the spiral origin — flipping the composition: a calm radial frame around a busy core, the rose window turned inside out.

Two details near the core reward a closer look:

Zoom: a magenta region filled with a regular lattice of small black holes, like a halftone dot-screen.
Where a magenta sector meets the spray it fills in as a regular dot-screen — a halftone of holes, not a solid block.
Zoom: a green triangular spike poking up into a blue field, with a turbulent blue-and-purple spray fraying out beneath it.
A green domain spike juts up into the blue while the zebra spray frays out beneath it — like a little jellyfish.

live (plays the build; press S for the static finished view)

Muted & vivid — dabbaba + ferz

dabbaba ×3  +  ferz ×3  ·  Vivid palette

Two colorbound pieces, but with very different fills: ferz lands densely and reads in full Vivid color, while dabbaba's sparser jumps leave its domains looking washed-out and dusty. The contrast gives the whole thing a faded, antique-watercolor palette you don't get anywhere else.

The fun part is the extent. The solve is identical toward the center either way, so the extent-300 field is just the middle of the extent-1000 one — but pushing out to 1000 lets whole new color regions appear and butt up against that same familiar core:

Extent 300: muted dusty pastel fields meeting along a central seam, with a turbulent core.
Extent 300 — the dusty core on its own.
live (300)
Extent 1000: the same core, now flanked by new layered and dripping color regions out toward the edges.
Extent 1000 — same core, new regions out past it.
live (1000)

Two of those new regions up close:

Zoom: pastel layered ridges stacked like sediment strata or topographic contour lines.
Strata — pastel ridges layered like sediment.
Zoom: bulbous vertical drips of purple, yellow and blue hanging from a diagonal edge, like melting wax.
Drips — bulbous stalactites, like melting wax.
URL='https://chrismo.github.io/screensavers/knights/?groups=dabbaba:3,ferz:3&extent=1000&speed=0&palette=0&nopanel=1'
# strata (right) and drips (lower-left):
node tools/shot.mjs "$URL" strata.png 5000 --size 1500,1500 --clip 1145,466,355,310 --scale 3
node tools/shot.mjs "$URL" drips.png 5000 --size 1500,1500 --clip 307,1021,430,420 --scale 3

Rainbow corduroy — knight + three-leaper

knight+three-leaper ×6  ·  Vivid palette  ·  extent 300

The whole field woven into fine diagonal multicolor twill, like iridescent raw silk.
One compound (knight+three-leaper, reaches 2 and 3), all six colors the same — no dominance, no big domains, just the whole field woven into fine diagonal rainbow twill, like iridescent raw silk.

It carries a couple of anomalies riding in the weave:

An orange blotch sitting at the seam where a cross-hatch region meets the diagonal twill.
an orange island at a texture seam
A solid coral-red bar slicing diagonally between the twill and a finer speckle.
a solid red domain-bar slicing the weave

live (plays the build; press S for the static finished view)

URL='https://chrismo.github.io/screensavers/knights/?groups=knight-threeleaper:6&extent=300&speed=0&palette=0&nopanel=1'
# the island (top-left) and the red bar (lower-right):
node tools/shot.mjs "$URL" island.png 3500 --size 1500,1500 --clip 79,71,280,240 --scale 4
node tools/shot.mjs "$URL" bar.png 3500 --size 1500,1500 --clip 1215,1245,280,255 --scale 4

Carnival — three reach-scales at once

wazir+ferz ×2  +  knight+dabbaba ×2  +  zebra+antelope ×2  ·  Vivid palette  ·  extent 300

A dense field of tiny colorful triangular flags and totems over black seams, with a calmer pinwheel of larger triangles at the center.
A deliberately graded roster — short (the king), medium (knight+dabbaba), and long (zebra+antelope), two colors each. Rather than one texture winning, the three scales blend into a dense folk-art carnival of tiny triangular bunting and totems, with a calmer pinwheel at the core. The "many scales blended" counterpoint to the dichotomy pieces above.

live (plays the build; press S for the static finished view)

Notable patterns

A dotted line — ferz + wazir

ferz ×4  +  wazir ×4  ·  Vivid palette  ·  extent 100

Zoom on a green checkerboard domain with a short horizontal row of about seven black (empty) cells embedded in it.
A small oddity. Inside one green colorbound domain (the green piece only lands on one checkerboard color, hence the green-on-black weave) sits a tidy horizontal run of ~7 empty cells — squares the green piece was blocked from at the moment their spiral-number came up, and never revisited.

Those empty cells are an anomaly — a spot the rule left blank and never came back to fill. Because ferz is colorbound, the cells it gets blocked on all fall on the same sublattice, so the empties line up into a short row instead of scattering. Short-reach colorbound pieces tend to make these linear anomalies; longer-reach pieces make scattered point ones instead.

live (zoomed in at a small extent so the anomaly is easy to spot)

URL='https://chrismo.github.io/screensavers/knights/?groups=ferz:4,wazir:4&extent=100&speed=0&palette=0&nopanel=1'
node tools/shot.mjs "$URL" dots.png 3000 --size 1200,1200 --clip 600,450,250,90 --scale 6

Pseudo-3D pyramids — alfil + wazir, zoomed all the way out

alfil ×4  +  wazir ×4  ·  Vivid palette  ·  extent 1000

Wide view: a speckled purple field with smooth green and yellow triangular pyramid shapes; one giant pyramid fans out from the center into the lower-right.
A mix of a colorbound piece (alfil) and a plain one (wazir), seen at a large extent. The alfil colors fill a fine speckled "sky"; the wazir colors build smooth domains whose boundaries radiate from the spiral origin as straight rays — so they read as triangular pyramids. The biggest has its apex right at cell 0,0 and fans into the lower-right.
Zoom on the bottom-left end of the pyramid range: the two largest green sawtooth peaks against the purple speckle, their faces filled with fine vertical striping.
The two biggest peaks, at the bottom-left end of the "mountain range" (the giant one is obvious in the wide shot). The domain wall is a self-similar sawtooth of nested triangles, and each face carries fine vertical striping plus a faint tonal gradient — that shading is what gives the whole thing its almost-3D, lit-from-the-side look. It's an illusion: every cell is flat; the gradient is just two colors interleaving at shifting density.

live (plays the build; press S for the static finished view)

URL='https://chrismo.github.io/screensavers/knights/?groups=alfil:4,wazir:4&extent=1000&speed=0&palette=0&nopanel=1'
# the two biggest peaks, bottom-left of the range
node tools/shot.mjs "$URL" zoom.png 5500 --size 2000,2000 --clip 100,1600,400,400 --scale 1.6

Three diagonal bugs — 8-color mixed roster

knight ×4  +  knight+antelope ×3  +  dabbaba+three-leaper ×1  ·  Vivid palette

The full finished field: a turbulent 8-color mosaic with a large solid red domain in one corner.
The finished field (~2.7M cells). Mixing three different reaches — knight (2), three-leaper (3), antelope (4) — plus a colorbound dabbaba breaks any clean periodicity into broadband turbulence, with one big solid red domain claiming an uncontested corner.
Zoom on the red domain: three small speckled 'bug' anomalies strung along the diagonal, plus the black border to the yellow region.
Zoom on the red domain. Three tiny "bug" anomalies sit along its main diagonal — knots of empty (black) cells speckled with a few cells other colors stole (note the recurring green Knight pixel). The corner bug perches on the black "domain wall" — a 1-cell-wide line of empty cells separating red from yellow.

These only appear once long-reach compound pieces are in the roster: a single far-away piece (antelope reach-4, three-leaper reach-3) can veto one specific cell deep inside another color's territory, seeding an anomaly. Two kinds show up — interior islands (specks deep in a solid field) and domain-wall anomalies (blooms along the borders). Plain short-reach knights can't reach in like this, so you mostly see clean domains instead.

live (plays the build at full tilt; press S for the static finished view)

URL='https://chrismo.github.io/screensavers/knights/?groups=knight:4,knight-antelope:3,dabbaba-threeleaper:1&extent=1000&speed=0&palette=0&nopanel=1'
# the three bugs + red/yellow corner (they sit at world (752,756) -> (810,810) -> (848,848))
node tools/shot.mjs "$URL" bugs.png 3500 --size 6000,6000 --clip 5225,399,420,420 --scale 3

One saboteur, one grain — knight + antelope

knight ×7  +  antelope ×1  ·  Vivid palette  ·  extent 500

Seven knight colors in vivid radial sectors around a dark turbulent bloom at the center.
Seven knights plus a single bare antelope. The antelope (reach 4) can't hold territory of its own, so it scrambles into a turbulent bloom at the center while the knights take clean radial sectors. But its long reach still vetoes lone cells deep inside those sectors — seeding anomalies.

The same anomaly species turns up twice — and lined up the same way:

A clean diagonal string of hollow empty-cell rings descending across a solid red domain.
A clean string of hollow rings descending the red domain.
A solid green domain with an isolated black-and-magenta island knot floating in it and bead-blooms along the lower border.
The same beads in green — a stray island knot, plus blooms along the wall.

The striking part: every anomaly the antelope seeds runs along the same diagonal — its own [4,3] move-line. So a lone saboteur gives the whole field one consistent grain. It's the same idea as the crosshair anomaly (a piece's symmetry printed as a shape); here the piece's reach direction is printed as the orientation of every anomaly. The menagerie below uses two different long pieces — two crossing grains — which is why its critters look so much more tangled and varied.

live (plays the build; press S for the static finished view)

URL='https://chrismo.github.io/screensavers/knights/?groups=knight:7,antelope:1&extent=500&speed=0&palette=0&nopanel=1'
# the ring-string (red, upper-right) and the island (green, lower-right):
node tools/shot.mjs "$URL" rings.png 4000 --size 1600,1600 --clip 1260,0,340,340 --scale 4
node tools/shot.mjs "$URL" island.png 4000 --size 1600,1600 --clip 1400,1400,200,200 --scale 4

The D6 menagerie — one roster, a whole zoo of anomalies

knight ×6  +  knight+antelope ×1  +  dabbaba+three-leaper ×1  ·  Vivid palette

A close cousin of the three bugs, bred to be an anomaly farm. The knight ×6 base builds big clean domains; the two minority long-reach compounds — knight+antelope (reach 4) and dabbaba+three-leaper (reach 3) — reach deep inside those domains and along their walls to seed an unusually wide variety of anomalies. And because the solve reorganizes at every scale, each extent is a different field — the deterministic nesting means the same critters are present at all of them, just shrunk.

The same roster at four extents — each a wholly different composition:

D6 at extent 200: dense radial turbulence with totem-like spires.
extent 200
live
D6 at extent 300: ornate radial sectors around a central knot.
extent 300
live
D6 at extent 500: a striped pyramid and bold wedges around the core.
extent 500
live
D6 at extent 1000: a vast dense circuit-board of color.
extent 1000
live

And the critters that turn up when you zoom in — a rough field guide:

A small plus-shaped anomaly: four empty arms around a single stolen center cell, in a solid blue field.
Crosshair — 4 empty arms + a stolen center; the leaper's own symmetry, imprinted.
A diagonal chain of small empty-cell rings, each ring beaded with a blue and yellow speck at its center, strung wall-to-wall into a green field.
Caterpillar — a chain of empty-cell rings, each beaded with a blue/yellow center speck, strung along a domain wall…
A short diagonal run of the same ring-beads with blue and orange center specks, floating loose in a clear cyan domain.
…or the same beads adrift in open domain, with no wall to string along.
A thin horizontal bead-chain stretched along a domain wall.
Worm — a bead-chain stretched along a wall.
A magenta domain band with feathered, thorny black-cell edges.
Spiny border — the long-reach domain's feathered edge.
A field corner packed with detail: a blue domain meeting cyan and green, magenta busy regions, a yellow patch with a small ring-bead caterpillar, and a bead-worm running along the lower seam.
Ornate corner — several critters at once where domains pile up at the field's edge: a caterpillar threading the yellow, bead-worms along the seams.

These sort into two axes — anomaly shapes (blob island · ring-string · crosshair · caterpillar/worm · wall-bloom) and boundary types (clean sawtooth · interdigitated comb · spiny) — captured in the taxonomy notes.

# the critters each sit at a different extent — this helper swaps it per shot
G='knight:6,knight-antelope:1,dabbaba-threeleaper:1'
shot() { node tools/shot.mjs "https://chrismo.github.io/screensavers/knights/?groups=$G&extent=$1&speed=0&palette=0&nopanel=1" "$2" "${@:3}"; }
shot 200 caterpillar.png        3000 --size 1200,1200 --clip 230,763,200,200 --scale 5
shot 600 caterpillar-adrift.png 5500 --size 1200,1200 --clip 1116,22,66,58   --scale 8
shot 200 crosshair.png          3000 --size 1400,1400 --clip 1037,1038,190,165 --scale 6
shot 300 worm.png               3500 --size 1400,1400 --clip 192,708,175,55   --scale 7
shot 300 spines.png             3500 --size 1400,1400 --clip 874,704,430,340  --scale 3.3
shot 700 ornate-corner.png      5500 --size 1200,1200 --clip 1095,0,105,105   --scale 6