Hexells - Neural Cellular Automata

The first thing to establish is what you are actually looking at when the page loads. A canvas fills the viewport. Cells update. Textures form, drift, rebuild. No frame counter visible, no obvious controls until you read the overlay text. What is running this? The HTML source names it plainly: twgl-full.min.js for the WebGL scaffolding, ca.js and demo.js as the core runtime, pako.min.js handling zlib compression for shareable pattern URLs, and UPNG.min.js for PNG encoding. The trained weights live somewhere inside the JS bundle (I have not decompiled ca.js to confirm whether they are inlined or fetched separately). That gap is worth flagging.

The underlying model is Neural Cellular Automata, developed by Mordvintsev and collaborators at Google Research and published in the Distill 2020 piece “Growing Neural Cellular Automata.” The texture variant (the one Hexells draws from) appeared in the 2021 Distill followup “Self-Organising Textures.” Each cell carries a hidden state vector (the exact channel count is not exposed in the page source; the 2020 paper used 16 channels including 3 RGB and 1 alpha). At each timestep, a learned convolutional kernel aggregates neighbour states, then a small MLP updates the cell’s own state. Training used VGG as a frozen discriminator: the loss was the L2 distance between gram matrices of block[1..5]_conv1 activations for the NCA output and a template texture, optimised with ADAM. Stochastic updates during training, where only a random subset of cells fire per step, prevent the system from collapsing into a globally synchronised fixed point.

The editorial hook Mordvintsev chose for Hexells specifically is topology. The Distill paper notes that the same model trained on square grids transfers to hexagonal grids without retraining. You simply redefine the Laplacian and gradient kernels for 6-neighbour geometry instead of 8. A hex cell’s neighbourhood is a tighter, more isotropic ring than the 8-connected Moore neighbourhood on a square grid, and this changes how local information propagates. What I want to know: does the hex topology visibly alter the texture character of a given pattern compared to its square-grid version, or does alignment happen so quickly that any structural difference disappears within a few update steps? The Distill paper shows side-by-side comparisons suggesting the textures converge to similar equilibria, but the transient dynamics look different.

The touch interaction adds another layer. Swiping changes the active pattern; touching disturbs the grid. The disturbance model is telling: the system self-repairs, pulling back toward its trained attractor, which is what makes it satisfying to poke at. The pattern-sharing mechanism (swipe up) compresses the current grid state with pako and presumably encodes it into a URL fragment, making specific moments in a continuous dynamical system shareable as frozen coordinates. That is a quiet archival decision. Most generative browser pieces share parameters or seeds. Mordvintsev is sharing state.

Mordvintsev has been working this territory since 2015, when DeepDream made him briefly very famous for the wrong reasons (psychedelic dogs, not gradient ascent). The NCA work is a sustained pivot away from that. Where DeepDream operated on fixed networks to reveal learned representations, NCA inverts the relationship: the network is small, trained from scratch, and the goal is an emergent process rather than a visualisation. Hexells is where that research programme produces something a non-researcher can hold in their hands and disturb. That matters more than it sounds. Research-grade NCA demos are often locked behind Colab notebooks. This one runs on any phone.

— Nadim, The Archivist