Algorithmic Art

Algorithmic Art is an official Anthropic Agent Skill that turns a prompt into original generative art written in p5.js, packaged as a single self-contained HTML viewer with seed navigation and live parameter controls. Instead of producing a static image, it builds a living algorithm whose every run is reproducible from a seed, so you can explore thousands of variations of flow fields, particle systems, and noise-driven compositions.

What is Algorithmic Art?

Algorithmic Art is a Claude skill (a folder of instructions Claude loads on demand) that creates generative art using p5.js rather than copying existing artists' work. It works in two stages: first it authors an algorithmic philosophy as a Markdown manifesto (a named aesthetic movement such as "Organic Turbulence" or "Quantum Harmonics"), then it expresses that philosophy in code as an interactive .html viewer plus the .js generative algorithm. The output is computational, parametric, and seed-reproducible — the same seed always produces an identical frame.

What it does

• Writes a 4-6 paragraph algorithmic philosophy (.md) describing the computational aesthetic.
• Implements the philosophy as p5.js generative code: flow fields, particle systems, Perlin noise, Voronoi tessellation, recursive subdivision, and L-systems.
• Uses the Art Blocks seeded-randomness pattern (randomSeed, noiseSeed) so output is deterministic and shareable.
• Ships a single self-contained HTML artifact that loads p5.js from a CDN and runs instantly in claude.ai artifacts or any browser.
• Builds an interactive sidebar: seed display, Previous/Next/Random/Jump-to-seed controls, parameter sliders, optional color pickers, and Regenerate/Reset/Download PNG buttons.

How it works

The skill starts from a required template, templates/viewer.html, which carries the fixed layout and Anthropic branding — Poppins and Lora fonts, light backgrounds, a gradient backdrop, and a structured sidebar. Claude keeps those fixed sections and replaces only the variable parts: the p5.js algorithm, the parameters object, and the matching UI controls. Parameters emerge from the philosophy itself — quantities, scales, probabilities, ratios, angles, and thresholds — rather than from a menu of preset pattern types. A reference file, templates/generator_template.js, demonstrates how to structure parameters, seeded randomness, and classes.

Who it's for

It is for creative coders, generative artists, designers, and developers using Claude (claude.ai, Claude Code, or the Claude API) who want gallery-quality computational art without hand-writing boilerplate. Anyone curious about Art Blocks-style seed art, p5.js sketching, or parametric design can drive it with a plain-language prompt and then refine the result by dragging sliders.

What you can build

• Flow-field paintings driven by layered Perlin noise and thousands of accumulating particle trails.
• Quantum-harmonic mandalas from phase-interfering particles.
• Recursive, fractal-like branching structures constrained by golden ratios.
• Stochastic crystallization pieces using circle packing or Voronoi relaxation.
• Print-style series: one algorithm, many seeds, each a unique variation in the same interactive viewer.

Why it matters

Most AI image tools output a fixed pixel grid you cannot tune or reproduce. Algorithmic Art instead delivers the algorithm, so the artwork is explorable, deterministic, downloadable as PNG, and entirely original — it never imitates a named living artist, which keeps the work clear of copyright concerns. Because everything is embedded in one HTML file, the result is trivial to share, fork, and extend, making it the authoritative Anthropic-authored way to do generative art with Claude.

1. Install in Claude Code (plugin marketplace)

/plugin marketplace add anthropics/skills
/plugin install example-skills@anthropic-agent-skills

2. Or add just this skill with the skills CLI

npx skills add anthropics/skills --skill algorithmic-art

3. Use it

Ask Claude for generative art, for example:

Create algorithmic flow-field art inspired by ocean currents, with seed navigation and adjustable particle count.

Claude writes the philosophy, builds the p5.js viewer, and returns a single interactive HTML artifact you can open in any browser.