C:\GRIFFIN\PROJECTS\GAMES\CABINFEVER>

[@] MAP
###C########P###
#...........$..#
#.&&..&&...&&..#
#......@.......#
#...*......&&..#
#..............#
###H########O###
GAMES/CABINFEVER

Doors are hotkeys. Or click the screen and walk with the arrow keys.

CabinFever

A dependency-free browser library that produces 17 traditional paper-marbling patterns with area-preserving geometric maps.

Status
In development
Stack
Generative Art · Computational Geometry · Simulation · JavaScript · Canvas
Source
github.com/Griffinhale/cabinFever
The library itself, drawing live. Each drop displaces the ink already floating rather than covering it, squeezing earlier colours into rings; then a comb drags the whole surface at once. Every operation preserves area exactly, which is what a film of pigment on water actually does. Tap to drop pigment, drag to comb.

At a glance

  • Outcome: Implements 17 traditional marbling patterns, including battal, gel-git, nonpareil, feather, hatip, suminagashi and Italian hair vein. Every tool is an area-preserving plane map.
  • Status: The second engine, after the first and 12 prototypes were discarded; all 17 patterns, the rake catalog and the texture pass ship in the repo. The video on this page predates the rake catalog.
  • Role: Solo: designed the model, the maps and the tests; reviewed AI-assisted implementation.
  • Stack & libraries: Plain ESM, zero dependencies, no build step, one canvas. A texture pass runs over CPU ImageData without WebGL.
  • Source: MIT-licensed at github.com/Griffinhale/cabinFever.
  • Validation: node --test checks every map for area preservation, every catalog rake for its decay bound, and drop composition to 1e-6. Every figure comes from a seed with explicit timesteps and no clock.
  • Limitations: No fluid solver and no color mixing, because pigment displaces rather than blends. The stylus is the one tool without exact area preservation. italianVein takes about 2.4 s against feather’s 380 ms.

CabinFever is a small browser library for paper marbling. You drop ink onto a floating film and comb it into 17 traditional patterns, from battal through nonpareil and feather to şal, bouquet, bird wing, hatip, suminagashi and the Italian hair vein. It needs nothing else installed and no build step. One <script type="module"> tag puts a marbling tray on a web page.

Tap or hold to drop ink. Drag to comb. Pick a rake from the catalog (needle, wide, nonpareil, fine, wavy, chevron, arc, bouquet) and your drag pulls it through. You can also run a whole pattern on whatever is already floating. stone is only drops. gelGit works a needle down and up across the tray. nonpareil draws a fine comb straight across, and feather adds a wide comb at right angles, in the order a marbler works. Every drop is seeded. Nothing reads the clock, so the same script and seed make the same pixels anywhere. Every picture on this page was made that way.

Ink on a marbling bath doesn’t cover other ink. It pushes it aside, because it floats on a thickened liquid that can’t be squeezed. So in CabinFever, every tool is a math rule that moves points on the tray without changing how much area anything covers. A drop moves each point by C + (P−C)·√(1 + r²/‖P−C‖²), which keeps area exactly. A comb tooth slides points sideways in a way that also keeps area. Edges between colors are stored as shapes instead of pixel grids. A strand pulled hair-thin stays sharp. The traditional patterns come straight out of these moves. The petals in hatip aren’t drawn. They’re what a pull toward the center does to rings inside rings. Twelve earlier prototypes and a first engine treated ink as areas that stop at each other, and all were discarded.

A full sheet of 246 drops, a gel-git and two comb passes builds in about 380 ms. A texture pass then adds paper grain and a darker rim along each edge. Right now all 17 patterns, the rake catalog, the rounded tooth and the texture pass ship, with a minimal example and the full playground in examples/. The video above is older than the rake catalog and the twelve newer patterns. A new clip is next.