Skip to content
AI Dev Toolkit.
Esc
  • AI Token CounterCount tokens for GPT, Claude, Gemini, DeepSeek, Qwen and more.Tool
  • LLM API Cost CalculatorEstimate per-request, daily and monthly API costs.Tool
  • AI Model ComparisonCompare prices, context windows and features across models.Tool
  • AI Model Pricing PagesSpecs, real costs and cheaper alternatives for popular models.Tool
  • Context Window CheckerSee whether your text fits each model’s context window.Tool
  • Subscription vs API CalculatorFind out whether a chat plan or the API is cheaper for you.Tool
  • GPU / VRAM CalculatorCheck how much VRAM a local model needs and which GPUs fit.Tool
  • Prompt Caching CalculatorEstimate savings from prompt caching.Tool

Claude skill · Design and art · Anthropic

Algorithmic art skill for Claude

Generative art with p5.js: seeded randomness, flow fields and particle systems, delivered as an interactive artifact with parameter controls.

Command
/algorithmic-art
Licence
Apache-2.0, copying allowed with attribution
Folder
4 files, 58 KB
Runs code
1 script

Overview

What it does

Like canvas-design, it starts from a written “algorithmic philosophy”, then implements it in p5.js. The work is seeded, so the same seed reproduces the same piece, and the result is an interactive viewer where you can change parameters and explore variations.

Claude must read templates/viewer.html before writing any HTML and keep its fixed sections, so every piece shares a working structure and only the algorithm and its controls change. A second template shows the expected p5.js code structure.

Triggers

When Claude uses it

  • Requests for art made with code: generative or algorithmic art, flow fields, particle systems.
Its description, which Claude matches against
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.

What it needs

  • Nothing to install; the output is an HTML artifact that loads p5.js.

Install

How to install it

Claude Code

Plugin (type in Claude Code)
/plugin marketplace add anthropics/skills
/plugin install example-skills@anthropic-agent-skills

The example-skills plugin installs 12 skills from this repository, including this one. Its skills are then namespaced, such as /example-skills:algorithmic-art.

Or copy the folder (shell)
git clone --depth 1 https://github.com/anthropics/skills.git
mkdir -p ~/.claude/skills
cp -r skills/skills/algorithmic-art ~/.claude/skills/

That makes it a personal skill, available as /algorithmic-art in all your projects. Copy it into .claude/skills/ in a repository instead to share it with your team.

claude.ai and the Claude API

Zip the skill folder, then in claude.ai open Customize > Skills, choose + and Create skill, then Upload a skill. Code execution must be turned on.

Upload with the Python SDK
from anthropic import Anthropic
from anthropic.lib import files_from_dir

client = Anthropic()
skill = client.skills.create(files=files_from_dir("algorithmic-art"))
print(skill.id)  # use as a custom skill_id with the code execution tool

Checks

SKILL.md validator results

Its SKILL.md (405 lines) run through our SKILL.md validator, with the folder’s file list, for both targets. These check the file’s format, not whether the skill works well.

Claude Code

0 errors, 0 warnings, 0 tips

claude.ai and the API

0 errors, 0 warnings, 1 tip

  • tipThe Claude Help Center’s upload guide gives a 200-character description limit for claude.ai, though the platform docs say 1,024. Keep it under 200 if you’ll upload it there.

Folder

What’s in the folder

  • LICENSE.txt11 KB
  • SKILL.md19 KB
  • templates/2 files, 28 KB

SKILL.md sections

  1. ALGORITHMIC PHILOSOPHY CREATION
  2. THE CRITICAL UNDERSTANDING
  3. HOW TO GENERATE AN ALGORITHMIC PHILOSOPHY
  4. PHILOSOPHY EXAMPLES
  5. ESSENTIAL PRINCIPLES
  6. DEDUCING THE CONCEPTUAL SEED
  7. P5.JS IMPLEMENTATION
  8. ⚠️ STEP 0: READ THE TEMPLATE FIRST ⚠️
  9. TECHNICAL REQUIREMENTS
  10. CRAFTSMANSHIP REQUIREMENTS
  11. OUTPUT FORMAT
  12. INTERACTIVE ARTIFACT CREATION
  13. CRITICAL: WHAT'S FIXED VS VARIABLE
  14. REQUIRED FEATURES
  15. USING THE ARTIFACT
  16. VARIATIONS & EXPLORATION
  17. THE CREATIVE PROCESS
  18. RESOURCES

Source

Licence and source

Related

More skills

All Claude skillsWrite your own skillSlash command builderGuide: subagents, skills and commands