What is a CPPN?

A "CPPN" — Compositional Pattern-Producting Network — is a way of generating images through code!

Here, we build our CPPN as a convolutional neural network, following the approach here by Mordvintsev, et al., "Differentiable Image Parameterizations", Distill, 2018.

What can I do?

Look at the cool output image!

It was produced by the specific "network" configuration.

Change the network structure

You can add or remove "layers"; add or remove the number of "filters" per layer, and you can change the "activation function" per layer. Just try clicking lots of things and see what kind of images they produce!

Note that each layer is built on the one prior to it, so this gives you some idea of what kind of shapes your network will be able to express.

Random Walk

You can just see what kinds of pictures the current network configuration can produce by clicking "Random walk". You'll see the final image change. Pressing the button again stops it at that point.


You can paste an image (just click anywhere on the page and paste your image from the clipboard) and get the network to try and replicate it by clicking "train". Typicall it takes to about 2,000-3,000 epochs to do well. Try running for longer!

For fun, once trained, try carefully varying one of the little circles from the latent vector. You should be able to transition between your trained image, and a non-trained, random one.

Inputs/Latent Vector

You can also drag the little circles in the "Latent vector" input at the front. These change the final image. In fact, this is all the "Random walk" button does; it just moves these circles.


One of the main benefits of a CPPN, over traditional generative image approaches, is that we can generate images of arbitrary size. If you click the "Download big" button, you'll get a 1000x1000 pixel version of your image!



Built by Noon from the Braneshop.