@genart-dev/mcp-server

Model Context Protocol server for genart.dev — 33 tools, 4 resources, and 3 prompts for creating and manipulating generative art with AI agents.

Works with any MCP client: Claude Code, Claude Desktop, Codex CLI, Cursor, and more.

Install

npm install -g @genart-dev/mcp-server

For screenshot/export capture, also install Puppeteer:

npm install -g puppeteer

Quick Start

Claude Code

claude mcp add genart-mcp -- genart-mcp

Claude Desktop

Add to claude_desktop_config.json:

{
  "mcpServers": {
    "genart": {
      "command": "genart-mcp"
    }
  }
}

Codex CLI

Add to .codex/config.toml:

[mcp_servers.genart]
command = "genart-mcp"

Then ask your AI agent to create generative art:

"Create a workspace with a p5.js sketch that draws a grid of rotating squares using the golden ratio"

Tools (33)

Workspace (5)

Tool	Description
create_workspace	Create a new .genart-workspace with optional initial sketches
open_workspace	Open an existing .genart-workspace and load all sketches
add_sketch_to_workspace	Add an existing .genart file to the active workspace
remove_sketch_from_workspace	Remove a sketch from workspace (optionally delete file)
list_workspace_sketches	List all sketches with metadata summaries

Sketch Lifecycle (7)

Tool	Description
create_sketch	Create a new .genart sketch — supports all 5 renderers
open_sketch	Open a sketch by ID and set selection
update_sketch	Update metadata, parameters, colors, canvas
update_algorithm	Replace algorithm source code with optional validation
save_sketch	Persist in-memory state to disk
fork_sketch	Create a variant with new ID and optional modifications
delete_sketch	Delete sketch file and remove from workspace

Selection & Context (4)

Tool	Description
get_selection	Full context for selected sketch(es) — algorithm, params, colors, philosophy
select_sketch	Set canvas selection to one or more sketches
get_editor_state	Full snapshot of workspace, sketches, and selection
set_working_directory	Set base directory for sandboxed file operations

Parameters (5)

Tool	Description
set_parameters	Update runtime parameter values
set_colors	Update runtime color palette values
set_seed	Set random seed (or generate random)
set_canvas_size	Change dimensions via preset or explicit W/H
randomize_parameters	Generate random values for all/specific parameters

Arrangement (3)

Tool	Description
arrange_sketches	Move sketches to explicit canvas positions
auto_arrange	Auto-layout with grid, row, column, or masonry
group_sketches	Create/update named groups of sketches

Gallery (2)

Tool	Description
list_sketches	Scan a directory for .genart files with metadata
search_sketches	Search loaded sketches by title, renderer, params, skills

Merge (1)

Tool	Description
merge_sketches	Combine parameters, colors, and philosophies from 2+ sketches

Capture (3)

Tool	Description
capture_screenshot	Headless capture of a sketch — returns metadata + inline JPEG for AI viewing
capture_batch	Capture multiple sketches in parallel
snapshot_layout	Structural summary of workspace layout for spatial reasoning

Export (1)

Tool	Description
export_sketch	Export as standalone HTML, PNG, SVG, raw algorithm, or ZIP bundle

Knowledge (3)

Tool	Description
list_skills	List available design knowledge skills by category
load_skill	Load a skill with full theory, principles, and examples
get_guidelines	Design guidelines for composition, color, parameters, animation, performance

Resources (4)

URI	Description
genart://skills	Available design knowledge skills
genart://presets/canvas	Canvas dimension presets (18 built-in)
genart://gallery	Loaded sketches with metadata summaries
genart://renderers	Available renderer types and metadata

Prompts (3)

Prompt	Description
create-generative-art	Guided workflow: concept → sketch → algorithm → capture → iterate
explore-variations	Fork and explore parameter/seed space across multiple variants
apply-design-theory	Apply Gestalt, color theory, composition, rhythm, or contrast principles

Supported Renderers

Type	Runtime	Algorithm
p5	p5.js	function sketch(p, state) { ... }
three	Three.js	function sketch(THREE, state, container) { ... }
glsl	WebGL2	Fragment shader source
canvas2d	Native	function sketch(ctx, state) { ... }
svg	Native	function sketch(state) { ... }

Library API

For programmatic use (e.g., building a custom MCP host):

import { createServer, EditorState } from "@genart-dev/mcp-server/lib";

const state = new EditorState();
const server = createServer(state);

// Connect to any MCP transport
// ...

Exports from @genart-dev/mcp-server/lib

Export	Description
createServer(state)	Create a configured McpServer instance
EditorState	Server-scoped mutable state (workspace, sketches, selection)
LoadedSketch	Type — sketch definition + file path + dirty flag
EditorMutationType	Type — mutation event names (sketch:created, workspace:loaded, etc.)
EditorMutationEvent	Type — mutation event payload
EditorStateSnapshot	Type — serializable snapshot of all state

EditorState

const state = new EditorState();

// Load from disk
await state.loadWorkspace("/path/to/project.genart-workspace");

// Access loaded sketches
state.sketches;               // Map<string, LoadedSketch>
state.selection;              // Set<string>
state.workspace;              // WorkspaceDefinition | null

// Sandbox file operations (for hosted environments)
state.basePath = "/safe/dir";
state.remoteMode = true;      // Return file content instead of writing to disk

// Listen for mutations
state.on("mutation", (event) => {
  console.log(event.type);    // "sketch:created", "workspace:loaded", etc.
});

// Serializable snapshot
const snapshot = state.getSnapshot();

Modes

stdio (default)

Standard MCP transport for CLI agents:

genart-mcp

Sidecar

Stdio transport + IPC mutation bridge for Electron app integration:

genart-mcp --mode sidecar

Mutations are forwarded to the parent process via Node IPC, enabling real-time UI updates when AI agents modify sketches.

Agent Attribution

Most mutation tools accept optional agent and model parameters for provenance tracking:

{
  "agent": "claude-code",
  "model": "claude-opus-4-6"
}

Stored in sketch metadata to track which AI agent created or modified each sketch.

Related Packages

Package	Purpose
@genart-dev/format	File format types, parsers, presets
@genart-dev/core	Renderer adapters, skill registry (dependency)

Support

Questions, bugs, or feedback — support@genart.dev or open an issue.

License

MIT