algorithmic-art Skill: Generative Art with p5.js

/plugin install example-skills@anthropic-agent-skills

algorithmic-art is an Anthropic example skill for generative art in code. Like its sibling canvas-design, it works in two stages: Claude first writes an algorithmic philosophy, a named computational aesthetic, and then expresses it as a p5.js sketch with seeded randomness and interactive parameters.

What it does

1. Algorithmic philosophy (.md): a one- or two-word movement name, such as “Organic Turbulence” or “Quantum Harmonics”, plus four to six paragraphs on computational processes, noise, particle behavior, temporal evolution and parametric variation.
2. Code expression (.html + .js): a p5.js implementation that is “90% algorithmic generation, 10% essential parameters”, with templates for an interactive viewer so you can explore variations.

Typical techniques include flow fields driven by layered Perlin noise, particle systems with accumulating trails, and interference patterns. The skill asks for original work and stresses craftsmanship throughout.

Install

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

Paid Claude.ai plans already include Anthropic’s example skills.

Example prompts

Create a flow-field piece inspired by river deltas, with a seed slider
Make generative art from particles that cluster like starlings
Build an animated background for my portfolio using noise fields

Tips and limits

• Open the HTML file in a browser to explore; adjust seeds and parameters there.
• Heavy particle counts can be slow on laptops; ask Claude to expose a density control.
• Great for portfolio backgrounds, posters and talks, less so for data visualization.
• Use webapp-testing if you embed a sketch in a larger app.

Related: theme-factory, best Claude Code skills.