Content & Media Creation · anthropics/skills

algorithmic-art

Name: algorithmic-art
Author: anthropics/skills

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.

L2 Local · Restricted workspaceV1 Commit-PinnedWrite FileDual-pass Audit

Author anthropicsGitHub anthropics/skills ↗Stars 174801License Apache-2.0（skill 目录自带 LICENSE.txt；GitHub API 仓库级 license 字段为 null）Commit 41bbe19d1a

Control levels describe skill capabilities and suggested control measures; they do not represent quality or safety certifications, nor do they dictate usability. Usage decisions rest entirely with users and administrators. Different agent hosts apply varying constraints; do not assume hosts provide automatic protection. Third-party skill copyrights belong to their original authors. Use at your own risk.

1How It Works & Mechanism

Pure prompt-orchestrated phased generation skill: No scripts, CLI, or API calls; all capabilities stem from phased agent instructions plus two template files.

SKILL.md

This happens in two steps: 1. Algorithmic Philosophy Creation (.md file) 2. Express by creating p5.js generative art (.html + .js files)

Directory contains only SKILL.md + templates/(viewer.html, generator_template.js) + LICENSE.txt; no .py or .sh files, and implementation occurs entirely within model text generation.

Two-stage relay architecture: Generates an 'algorithmic philosophy' (art movement manifesto as .md) first, followed by translating that philosophy into code later in the same session.

SKILL.md

The same version receives the philosophy and EXPRESSES IT IN CODE - creating p5.js sketches that are 90% algorithmic generation, 10% essential parameters.

Purpose of the philosophy segment: Reframes 'coding a drawing' into 'first defining a computational aesthetics movement, then implementing its code expression', avoiding generic patterns piled up by the model.

HTML output is not freeform but uses templates/viewer.html as a literal starting point: preserves FIXED sections (layout, Anthropic branding, seed controls, Actions), only replacing parameters and algorithms.

SKILL.md

Use that file as the LITERAL STARTING POINT - not just inspiration

Header comments WHAT TO KEEP / WHAT TO CREATIVELY EDIT in viewer.html (lines 1-10) reinforce SKILL.md; this serves as the mechanism enforcing output style constraints.

The artwork itself is written on the fly by the model: algorithm areas in the template are placeholder comments, and the model writes generateFlowField, draw, Particle, etc. ad hoc based on the philosophy and conceptual seed.

templates/viewer.html

function generateFlowField() { // fill this in }

No preset algorithm library or pattern menu; output quality depends on model capability + template constraints. generator_template.js only provides structural principles and utility functions (hexToRgb, mapRange, saveCanvas, etc.); SKILL explicitly states 'These are TOOLS and PRINCIPLES, not a recipe'.

Reproducibility discipline (Art Blocks style): identical seed must produce identical output via dual randomSeed + noiseSeed seeding.

SKILL.md

randomSeed(seed); noiseSeed(seed);

Both template initializeSystem() and generator_template.js initializeSeed() implement this pattern; prev/next/random buttons in viewer.html all re-invoke initializeSystem().

Unique conceptual layer: Deduces a 'conceptual seed' from the user's raw prompt—weaving subtle references into algorithmic parameters and behaviors rather than literal replication.

SKILL.md

The concept is a **subtle, niche reference embedded within the algorithm itself** - not always literal, always sophisticated.

Described as the artwork's 'quiet conceptual DNA', analogous to a jazz musician's musical quotation; a key design choice for transforming user input into differentiated art.

2Core Capabilities

01Generate a 4-6 paragraph 'algorithmic philosophy / generative art movement manifesto' and export as .md

02Deduce a subtle conceptual seed from user requests and embed it into algorithms

03Generate self-contained interactive p5.js HTML artifacts based on a fixed branded template (integrated seed controls, parameter sliders, color pickers, and resets)

04Seeded reproducible generation + seed navigation (display, Prev, Next, Random, jump), enabling batch generation of 100 variants

05Parametric system design: map philosophical traits into adjustable parameters (count, scale, probability, ratio, angle, threshold) and generate corresponding UI sliders

06PNG export capability (saveCanvas)

07Flexible lifecycle control: supports static (noLoop), animated, or parameter-triggered redraw modes, with real-time parameter/color updates

3External Dependencies

Kind	Dependency / Endpoint
network	p5.js CDN
network	Google Fonts (Poppins/Lora)
package	p5.js 1.7.0 (浏览器端库)

4Recommended Governance & Evidence

Suggested Controls for Safe Operation

For Agent Runtime

Restrict working directory

For Administrators

Retain operation logs

Evidence & Triggers (File Paths & Excerpts)

本地工作目录: File read/write and artifact output: SKILL.md instructs the agent to output .md philosophy files and .html artifact files (the deliverables of the skill itself).

Audit Notes: 🔵 Blue: The skill itself consists purely of instructions (no scripts, outbound network calls, or credential access), performing only local template reads and deliverable file writes (.md/.html), matching the 'local read/write only' tier rather than 🟢 (🟢 requires zero local writes, whereas this skill explicitly mandates writing files). Note two operational facts: ① Output HTML loads cdnjs p5.js and Google Fonts when opened in the user's browser (network activity occurs on the artifact consumer side, not the agent execution side); ② The artifact contains on-the-fly JS written by the model, representing an arbitrary code execution surface, though running within an artifact sandbox or local browser with no credentials. SKILL.md:109-113 mandates reading templates first; line 302 claims no external dependencies beyond the p5 CDN, though Google Fonts are also an external dependency.

5Second-Pass Verification

[ok] 外部资源：p5.js cdnjs 引用真实存在 — viewer.html:23 确有 cdnjs p5 1.7.0 script 标签
[ok] 外部资源：Google Fonts 引用真实存在 — viewer.html:24-26 preconnect + stylesheet（Poppins/Lora）
[ok] 模板即起点、算法区为占位（实现原理核心证据） — viewer.html 中 generateFlowField()/draw()/Particle 构造/updateParam/updateColor 均为 '// fill this in' 占位注释
[discrepancy] SKILL.md 声称 FIXED Actions = Regenerate + Reset + Download PNG 按钮 — 实际 viewer.html Actions 区（425-427 行）仅有 Reset 按钮；模板无 Regenerate 与 Download PNG 按钮。重生成靠 seed 的 Prev/Next/Random 隐式完成；PNG 导出函数 exportImage() 只在 generator_template.js 中存在且无 UI 接线
[discrepancy] SKILL.md 声称 seed 区含『Jump to seed input + Go button』 — viewer.html:342 只有 <input type=number onchange=updateSeed()>，无 Go 按钮（跳转功能在，UI 形态与描述不符，属轻微出入）
[discrepancy] 文档内部一致性：交付文件类型 — SKILL.md:7/11 称输出 .md + .html + .js 三类文件，SKILL.md:399 却要求 'Embed algorithms inline in the HTML artifact (don't create separate .js files)'，正文 302 行又称产物除 p5 CDN 外无任何外部导入（未计字体）——同一文档三处表述互斥
[discrepancy] 『works immediately in any browser - no setup required / completely self-contained』声明 — 产物依赖 cdnjs p5.js 与 Google Fonts 两个网络端点，离线/无网环境无法立即工作；『自包含』仅在联网前提下成立
[ok] 双种子可复现模式（randomSeed+noiseSeed）落地 — SKILL.md:139-140 指令 + viewer.html initializeSystem() 内 'randomSeed(params.seed); noiseSeed(params.seed);' 双处一致

6Verdict & Scenarios

Original dual-layer creative framework of 'philosophy first + conceptual seed', avoiding homogenized pattern-menu outputs

Strict output discipline via fixed brand templates and seed navigation, ensuring consistent style, reproducibility, and explorability

Thorough engineering details: Art Blocks-style dual seeding, parametric design guidelines, and complete best practices for performance, export, and reset

Anti-plagiarism stance embedded in description, guiding original generation over copying works of famous generative artists

Best for: Users who want Claude to generate generative art that has thematic depth, interactivity, and reproducibility: artistic concept exploration, NFT/Art Blocks-style series (seed navigation natively supports 100-edition runs), and rapid interactive demos with an Anthropic brand aesthetic. Also suited for education: breaking generative art into two inspectable phases of 'philosophy → algorithm'.

Not for: Offline or air-gapped environments (relies on CDNs and web fonts); requests strictly requiring exact replication of an existing artist's style or work (explicitly prohibited by the skill); strictly controlled environments with zero tolerance for generated code risks (on-the-fly model code generation requires review); users expecting buttons/file lists in SKILL.md to match templates like a rigid contract (minor discrepancies exist).

Install Agent-Ready

① Verified Mirror 2026-09-06

Option A · Direct DownloadDownload algorithmic-art.tar.gz

sha256: c72553d5d7cf3344…

Option B · Copy Guide for Agent

install.json

Agents automatically download and verify mirrors from this JSON guide.

② Upstream GitHub

GitHub Repo ↗

Pinned to commit 41bbe19d1a.