Claude Official Skill: algorithmic-art

What it is

The algorithmic-art skill is an official Claude skill that teaches Claude Code how to create algorithmic art using p5.js. It provides rules for seeded randomness, interactive parameter exploration, and code-driven visual generation. When installed, Claude Code produces self-contained p5.js sketches that create generative visuals with reproducible outputs.

Creative coders, generative art enthusiasts, and developers who want to produce visual art through code use this skill to guide Claude Code in producing well-structured p5.js sketches with proper randomness seeding and parameter controls.

How it saves time or tokens

Writing generative art code from scratch requires understanding p5.js APIs, implementing proper random seeding for reproducibility, and building parameter controls for interactive exploration. This skill pre-loads these patterns into Claude Code, so the agent produces correct generative art code without you needing to specify seeding strategies, canvas setup, or interaction patterns in every prompt.

How to use

1. Install the skill:

claude skill install anthropics/skills/algorithmic-art

1. Or manually copy the SKILL.md content to .claude/skills/algorithmic-art/SKILL.md
2. Ask Claude Code to create algorithmic art:

> Create a generative art piece with flowing particle systems
> Make a recursive fractal tree with randomized branching
> Generate a tiling pattern with interactive color controls

Example

// Seeded generative art sketch (produced by Claude with this skill)
let seed;

function setup() {
  createCanvas(800, 800);
  seed = floor(random(99999));
  noLoop();
}

function draw() {
  randomSeed(seed);
  background(20);
  noFill();

  for (let i = 0; i < 200; i++) {
    let x = random(width);
    let y = random(height);
    let r = random(20, 100);
    let hue = map(y, 0, height, 0, 360);
    stroke(hue, 80, 90, 30);
    strokeWeight(random(0.5, 2));
    ellipse(x, y, r, r * random(0.5, 1.5));
  }
}

function mousePressed() {
  seed = floor(random(99999));
  redraw();
}

Related on TokRepo

• AI Tools for Coding -- explore coding skills and tools for AI-assisted development
• Prompt Library -- discover prompts and skills for creative and technical tasks

Common pitfalls

• Always use randomSeed() for reproducible outputs. Without seeding, each run produces different results, making it impossible to reproduce a specific artwork.
• p5.js sketches run in the browser. Keep computational complexity reasonable to avoid freezing the browser tab with large particle counts or deep recursion.
• Color mode matters. Switch to colorMode(HSB, 360, 100, 100) early in setup for more intuitive color control in generative art.