skills.rest
virahitvin8
virahitvin8COMMUNITY
Explore all skills by this author →
GitHub

algorithmic-art

Generates seeded p5.js generative art with interactive parameter controls in self-contained HTML files.

2|Updated May 30, 2026
Search Tags:#seeded randomness#p5.js#creative coding#generative art#algorithmic art#flow fields#particle systems
One-click install
npx skills add https://github.com/virahitvin8/crafty-gis --skill algorithmic-art-virahitvin8
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: algorithmic-art
Source: https://github.com/virahitvin8/crafty-gis/tree/main/GIT_STAR/assignment-generator/antigravity-skills-main/antigravity-skills-main/skills/algorithmic-art
Command: npx skills add https://github.com/virahitvin8/crafty-gis --skill algorithmic-art-virahitvin8

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires p5.js.

What problem does it solve? Creating original generative art requires both a coherent aesthetic concept and working code, which is difficult to produce consistently from scratch. ## Core Features & Use Cases - Algorithmic Philosophy Generation: Produces a written generative art manifesto (.md) that guides the visual direction before any code is written. - Seeded p5.js Implementation: Builds reproducible generative algorithms using seeded randomness, noise fields, particles, and flow systems. - Interactive Viewer: Outputs a single self-contained HTML artifact with seed navigation, parameter sliders, color pickers, and reset/regenerate actions. - Use Case: Ask for a flow-field artwork inspired by ocean currents and receive a philosophy document plus an interactive HTML piece where you can browse seeds 1-100 and tune particle count, noise scale, and palette. ## Quick Start Create an algorithmic art piece about organic turbulence with an interactive viewer I can open in my browser.

Frequently Asked Questions about algorithmic-art

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

FAQPage Schema
How do I create generative art with p5.js?▼

Define a parameters object, seed the randomness with randomSeed() and noiseSeed(), then implement your algorithm in setup() and draw(). This skill generates the full algorithm plus an interactive HTML viewer with sliders and seed controls.

What is seeded randomness in generative art?▼

Seeded randomness initializes the random and noise generators with a fixed seed value so the same seed always produces identical output. This enables reproducible Art Blocks-style variations where each seed number yields a unique but repeatable artwork.

Does the generated art work without a server?▼

Yes, the output is a single self-contained HTML file with p5.js loaded from a CDN and all code inline. It opens directly in any browser or runs as a claude.ai artifact with no setup required.

Can I explore different variations of the same algorithm?▼

Yes, the viewer includes previous, next, random, and jump-to-seed buttons for browsing variations. You can also adjust parameter sliders and color pickers in real time, then reset to defaults or download the canvas as a PNG.

What are the limitations of p5.js generative art?▼

Very large particle counts or expensive per-frame calculations can reduce frame rates in animated pieces. Complex static compositions may need noLoop() after generation, and extremely high-resolution exports require increasing canvas size manually.

Related Skills

Explore More Design & Creative Skills→
AIDotNetAIDotNet
634

creative-production-moodboard-explorer

Generates image-first mood boards with intake, batch image generation, and inline MCP review.

Official
Advanced
BluebagAIBluebagAI
28

canvas-design

Generate single-page visual designs from a design philosophy in PNG or PDF.

Official
Advanced
pmksharpmkshar

color-palette-extractor

Extract dominant colors from images and generate complementary palettes.

Community
Intermediate
toanalientoanalien

shader

Generate GLSL fragment shaders for procedural graphics and textures.

Community
Intermediate