algorithmic-art

Generate reproducible generative art with seeded randomness in HTML5 canvas or p5.js.

174|23|Updated Apr 3, 2026
One-click install
npx skills add https://github.com/RedWoodOG/Hermes-Desktop --skill algorithmic-art-redwoodog
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: algorithmic-art
Source: https://github.com/RedWoodOG/Hermes-Desktop/tree/main/skills/claude-code/algorithmic-art
Command: npx skills add https://github.com/RedWoodOG/Hermes-Desktop --skill algorithmic-art-redwoodog

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Art creation often requires recreating complex visuals; this skill provides a structured, code-driven approach to producing repeatable generative artwork with seed control.

Core Features & Use Cases

  • Create self-contained HTML canvases or p5.js sketches that render procedural art from a seed.
  • Support multiple techniques (flow fields, recursion, tessellation) to explore visual styles.
  • Use case: an artist wants to generate a series of unique pieces by varying the seed, then export to PNG or SVG for portfolio.

Quick Start

Open a self-contained HTML sketch, adjust the seed value, and refresh to regenerate a new art piece.

Frequently Asked Questions about algorithmic-art

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate reproducible generative art with p5.js?

Reproducible generative art with p5.js is generated by applying seeded randomness to your code-based templates. Adjusting the seed value allows you to regenerate exact visual outputs, enabling consistent design explorations across multiple renders.

Can I use HTML5 canvas for algorithmic art without external dependencies?

HTML5 canvas supports algorithmic art creation through self-contained HTML scripts with seeded randomness. You can build procedural visuals like flow fields or tessellations directly in the browser without requiring external library dependencies.

What techniques are supported for creating procedural visuals with seeded randomness?

Seeded randomness supports procedural visual techniques including flow fields, recursion, and tessellation. These methods allow you to explore unique visual styles on an HTML5 canvas or p5.js sketch by simply varying the initial seed value.

How do I export p5.js sketches to PNG or SVG for a design portfolio?

Exporting p5.js sketches to PNG or SVG for a design portfolio requires setting up optional export paths within your self-contained HTML framework. This allows you to save your generated algorithmic art pieces directly from the canvas.

Does seeded randomness in generative art allow for unique visual variations?

Seeded randomness in generative art allows for unique visual variations by changing the seed value. While the seed ensures reproducible renders for a specific piece, altering it generates an entirely new, unique artwork for your series.

Why are my p5.js generative art renders not repeatable across refreshes?

Generative art renders in p5.js are not repeatable across refreshes if seeded randomness is not implemented. To achieve reproducible visuals, you must explicitly define and control the seed value within your code-based template.