live // 0x000000

scripts become drawings.

A gallery and tool for code that draws. Each visit generates a new composition; each card pairs an algorithm with its output. No photography, no gradients, no warmth -- only rules and pixels.

Browse the gallery

128 sketches

12,408 renders

3 channels

// random walker // flow field // recursive subdivision // poisson disc // L-system // reaction diffusion // truchet tiles // circle packing // noise contour // space-filling curve

/* gallery */

Sketches in rotation

Each card is a self-contained sketch: the canvas above, the source below. Click view to see the full code in the side panel.

view:

/* about */

A small studio for plottable code.

Scriptgrapher is a working studio for generative graphics. We publish daily sketches, archive their source, and treat the algorithm as the artwork itself. The site you are reading is a sketch too -- a masonry of canvases that re-rolls on every load.

We borrow the toolbox of Processing, p5.js, and the plotter community: random walkers, flow fields, recursive subdivisions, Truchet tiles. We avoid photography, serifs, and warmth. The page is graph paper; the code is the ink.

weekly drop of new sketches
open source for every piece
plottable -- export to SVG for AxiDraw

manifesto.js


const manifesto = {
  medium: 'algorithm',
  surface: 'canvas',
  palette: [
    '#3366ff',
    '#ff3366',
    '#33ff66'
  ],
  avoid: [
    'photography',
    'gradients',
    'warmth'
  ],
  render(ctx) {
    while (true) ctx.draw();
  }
};

/* tools */

Build your own sketch.

Three primitives, three colors, infinite outcomes. Pick a starter, tweak the parameters, render to canvas or export to SVG.

Random Walker

A point steps in random directions, leaving a trail. The simplest generator -- and still the most surprising.

walker(steps: 4096, drift: 0.6)

Flow Field

Particles ride a Perlin-noise vector field. Curves emerge from a hidden topography.

flow(scale: 0.012, agents: 600)

Recursive Subdivision

Split a rectangle, choose a side, split again. Mondrian compositions, generated.

subdivide(depth: 6, bias: 0.42)

Circle Packing

Drop circles of decreasing radius, never overlapping. The negative space tells the story.

pack(min: 2, max: 32, attempts: 800)

/* submit */

Got a sketch?

Paste a self-contained snippet -- canvas, SVG, or shader. We render, archive, and credit. Sketches are reviewed weekly; the best land on the home grid.

sketch.js