Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
 
← Back to list

Algorithmic Art (algorithmic-art)

Official

Official skill that first writes a generative-art philosophy, then implements it as a self-contained p5.js HTML viewer with seed navigation and parameter sliders.

Image & VideoIntermediate★ 177,650⑂ 21,037AI score 9/10Last updated: Sep 22, 2026

What it does

  • Step 1: produces an .md "algorithmic philosophy" (4–6 paragraphs) — names the movement and defines how it expresses itself through noise fields, particles, forces, and temporal evolution.
  • Step 2: writes the p5.js algorithm and builds a single self-contained HTML artifact starting from templates/viewer.html, including parameter sliders, optional color pickers, seed navigation (prev/next/random/jump), plus Regenerate, Reset and Download PNG buttons.
  • Enforces reproducibility via randomSeed/noiseSeed so the same seed always renders the same piece (Art Blocks pattern).
  • Explicitly requires original algorithms rather than reproducing existing artists' work.

Who it's for

  • Designers, developers, and artists getting into creative coding and generative art.
  • Anyone who wants to explore seed-based variation series for prints or digital collections.
  • Educators demonstrating flow fields, L-systems, or Voronoi relaxation interactively.

Example uses

  1. "Make a flow-field piece that feels like ocean swell" → philosophy doc plus an HTML viewer with particle-count and noise-scale sliders.
  2. "Show me variations for seeds 1–100" → one artifact with seed navigation and a gallery mode.
  3. "A monochrome recursive branching piece" → viewer that skips the color section and exposes branch angle and recursion depth only.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/anthropics/skills/HEAD/skills/algorithmic-art/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the skills/algorithmic-art folder from the GitHub repo anthropics/skills into my ~/.claude/skills/algorithmic-art/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone --depth 1 https://github.com/anthropics/skills.git /tmp/anthropic-skills && mkdir -p ~/.claude/skills && cp -r /tmp/anthropic-skills/skills/algorithmic-art ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal.
  2. Clone the official repo: git clone --depth 1 https://github.com/anthropics/skills.git /tmp/anthropic-skills
  3. Create your skills folder: mkdir -p ~/.claude/skills
  4. Copy the whole skill, templates included: cp -r /tmp/anthropic-skills/skills/algorithmic-art ~/.claude/skills/
  5. Verify with ls ~/.claude/skills/algorithmic-art/templates — you should see viewer.html and generator_template.js.
  6. Restart Claude Code and ask something like "create generative art with code" to trigger the skill.
  7. Open the generated HTML file in any browser; no server is needed (p5.js loads from a CDN, so keep internet access).
View source on GitHub ↗