genart.dev
Examples

Example Gallery

How to browse, render, and learn from the example projects.

Rendering Examples

Use the CLI to render any example:

# Render a single example
genart render node_modules/@genart-dev/examples/projects/noise-field.genart

# Batch render with multiple seeds
genart batch node_modules/@genart-dev/examples/projects/noise-field.genart --seeds 1-10

# Create a montage of all examples
genart batch node_modules/@genart-dev/examples/projects/*.genart --output-dir ./renders
genart montage ./renders --columns 4 --tile-size 400x400

Opening in the Desktop App

  1. Launch the genart.dev desktop app
  2. Use File > Open Sketch and navigate to the example .genart file
  3. The sketch renders on the canvas — tweak parameters in the sidebar

Opening with MCP

{
  "tool": "open_sketch",
  "arguments": {
    "path": "./node_modules/@genart-dev/examples/projects/noise-field.genart"
  }
}

Learning from Examples

Each example demonstrates specific techniques:

  • Parameters — How to define and use tunable parameters
  • Components — Using registered components (noise, PRNG, easing)
  • Design layers — Typography overlays, filter effects, composition guides
  • Renderers — Idiomatic patterns for each rendering engine