DEV Community

John Samuel
John Samuel

Posted on

I Built a Cellular Automata Explorer in WebAssembly — Here Are 21 Visual Experiments

The project

Over 21 days in May 2025, I used cellular automata as a daily sketchbook: one tool, one new constraint, one visual experiment per day. The result is CellCosmos — a browser-based elementary cellular automata explorer.

The twist: the core automaton logic is written in French-syntax source code using a multilingual programming language I've been building. That French source is compiled to WebAssembly (WASM) and runs at near-native speed in the browser.


How it works technically

A cellular automaton starts with a finite grid of cells. Each cell holds a discrete state (in CellCosmos, small integers representing phases or ages). At each time step, every cell updates simultaneously based on a lookup at a small local neighborhood.

For a 1D elementary CA (the Wolfram model):

  • Each cell looks at itself and its two immediate neighbors → 3 cells → 8 possible binary patterns → 256 possible rules (Rule 0 through Rule 255)

For 2D automata, the neighborhood is the 4 orthogonal neighbors (von Neumann) or 8 surrounding cells including diagonals (Moore).

The build pipeline

The deployment is fully automated via GitHub Actions:

  1. French-syntax source is compiled to WAT/WASM
  2. The expected WASM exports are verified
  3. The public/ directory is published to GitHub Pages as a static site — no server required

Parameters exposed in the tool

Parameter Options
Rule selector 0–255, slider + named presets (Rule 30, 90, 110, 150, 184…)
Canvas shape Rectangle, Circle, Ellipse, Triangle
Initial state Centre seed or random distribution
Color Background + multi-stop gradient mapped to cell states
Boundary Hard edge or toroidal wrapping
Probability 0.0–1.0 stochastic transition strength
Direction LTR or RTL rule application

Every configuration can be downloaded as a PNG or shared via a URL that encodes the full parameter state.


The 21 experiments

Breathing Life into Cellular Automata with Color

  1. Breathing Life into Cellular Automata with Color
  2. Painting Landscapes: Cellular Automata Through Color Gradients
  3. Chromatic Evolution: Expanding the Color Palette of Cellular Automata
  4. Shifting Origins: Exploring Position Effects in Cellular Automata
  5. Mirrored Emergence: Shifting Origin Points in Cellular Automata
  6. Symmetry: Bidirectional Rule Generation in Cellular Automata
  7. The Wandering Point: Reflective Symmetries in Cellular Automata
  8. Pattern Emergence: How Position Transforms Cellular Automata Behavior
  9. Binary Genesis: Patterns Emerging from Two Initial Points
  10. The Multiplicity Effect: Scaling Initial Points in Cellular Automata Systems
  11. The Edge Effect: How Boundary Conditions Shape Cellular Automata Landscapes
  12. Unveiling the Grid: What Shape Reveals About Cellular Behavior
  13. When Points Cluster: Unexpected Emergent Patterns in Cellular Automata
  14. Rule Strata: The Aesthetic Potential of Layered Color Generation
  15. Rule Strata (continued)
  16. Layered Evolution: Bidirectional Rule Generation in Cellular Automata
  17. Vertical Initialization Reimagined: The Surprising Effects of Layered Rule Application
  18. Chromatic Chaos: Multi-layered Rule Applications in Cellular Automata
  19. Rolling the Dice on Determinism: A Probabilistic Take on Cellular Automata
  20. When Three Points Meet Probability: Natural Phenomena in Cellular Automaton Patterns
  21. Reversing the Flow: Right-to-Left Rule Application in Cellular Automata

What I took away

Across these 21 posts, a few themes kept surfacing. Color is not decoration — it is a lens; the same rule under different palettes reads as geological strata, organic growth, digital glitch, or abstract painting. Space matters: moving the origin, wrapping the boundary, or changing the canvas shape transforms the composition even when the underlying dynamics are identical. Layering rules creates emergent complexity at the boundaries between regimes. And probability bridges the gap between crisp mathematical automata and the textures we recognize from nature.

The unifying thread: cellular automata are endlessly configurable once you treat them as a medium for visual exploration rather than only as objects of theoretical study. Every parameter — rule, palette, seed, boundary, shape, direction, probability — is a creative control.

The 21 days are over, but the exploration continues.


Try it yourself

The "Copy link" button in the tool encodes the full parameter state into a shareable URL — rule, palette, canvas shape, seed position, probability, direction — so any configuration can be bookmarked or sent to someone else.

Top comments (0)