@genart-dev/core

Renderer adapters, skill registry, and runtime interfaces for genart.dev — a generative art platform with an MCP server, desktop app, and IDE extensions.

Re-exports everything from @genart-dev/format so consumers get the full format API without a separate import.

Install

npm install @genart-dev/core

Usage

import {
  createDefaultRegistry,
  createDefaultSkillRegistry,
  parseGenart,
  resolvePreset,
} from "@genart-dev/core";

// Set up renderer registry with all 5 adapters
const renderers = createDefaultRegistry();

// Parse a .genart file and resolve its renderer
const sketch = parseGenart(JSON.parse(fileContents));
const adapter = renderers.resolve(sketch.renderer.type); // → P5RendererAdapter

// Validate an algorithm for a specific renderer
const result = adapter.validate(sketch.algorithm);
if (!result.valid) {
  console.error(result.errors);
}

// Generate standalone HTML (embeds algorithm + CDN runtime)
const html = adapter.generateStandaloneHTML(sketch);

// Browse design knowledge skills
const skills = createDefaultSkillRegistry();
skills.list("composition"); // → 6 composition skills
skills.list("color");       // → 6 color skills

Renderer Adapters

Five pluggable rendering engines, each implementing the RendererAdapter interface:

Adapter	Type	Language	Runtime	Algorithm Signature
P5RendererAdapter	p5	JavaScript	p5.js 1.x	function sketch(p, state)
Canvas2DRendererAdapter	canvas2d	JavaScript	Native	function sketch(ctx, state)
ThreeRendererAdapter	three	JavaScript	Three.js	function sketch(THREE, state, container)
GLSLRendererAdapter	glsl	GLSL	WebGL2	Fragment shader source
SVGRendererAdapter	svg	JavaScript	Native	function sketch(state)

import { P5RendererAdapter } from "@genart-dev/core";

const p5 = new P5RendererAdapter();

// Validate algorithm source
p5.validate(algorithm);

// Compile for execution
const compiled = await p5.compile(algorithm);

// Create a live instance (browser context)
const instance = p5.createInstance(compiled, sketch.state, sketch.canvas);
instance.mount(document.getElementById("canvas"));
instance.updateState(newState);
instance.captureFrame({ format: "png" }); // → data URL

// Generate standalone HTML with embedded CDN runtime
const html = p5.generateStandaloneHTML(sketch);

// Get starter template for new sketches
const template = p5.getAlgorithmTemplate();

RendererRegistry

import { createDefaultRegistry, RendererRegistry } from "@genart-dev/core";

// Pre-loaded with all 5 adapters
const registry = createDefaultRegistry();

registry.resolve("p5");      // → P5RendererAdapter
registry.resolve("glsl");    // → GLSLRendererAdapter
registry.list();             // → ["p5", "canvas2d", "three", "glsl", "svg"]
registry.getDefault();       // → P5RendererAdapter
registry.has("three");       // → true

Skill Registry

11 built-in design knowledge skills grounded in classical design theory — composition principles (Arnheim, Wong) and color theory (Albers, Itten). Each skill includes theory text, key principles, academic references, and optional renderer-specific algorithm examples.

Composition Skills (6)

ID	Complexity	Source
golden-ratio	Intermediate	1:1.618 proportions, spiral layouts
rule-of-thirds	Beginner	3x3 grid, power points, dynamic balance
visual-weight	Intermediate	Size, value, saturation, position balance
gestalt-grouping	Intermediate	Proximity, similarity, closure, continuity
figure-ground	Beginner	Positive forms vs. negative space
rhythm-movement	Advanced	Repetition, variation, progression, flow

Color Skills (6)

ID	Complexity	Source
color-harmony	Beginner	Complementary, analogous, triadic, split-complementary
simultaneous-contrast	Advanced	Albers' adjacent color perception shifts
color-temperature	Beginner	Warm (advances) vs. cool (recedes)
itten-contrasts	Advanced	Itten's 7 contrast types
value-structure	Intermediate	Lights, mid-tones, darks; tonal keys
palette-generation	Intermediate	Algorithmic OKLCH color space generation

import { createDefaultSkillRegistry } from "@genart-dev/core";

const skills = createDefaultSkillRegistry();

const skill = skills.resolve("golden-ratio");
skill.theory;              // Markdown theory text
skill.principles;          // Key design principles
skill.references;          // Academic citations
skill.suggestedParameters; // Example ParamDefs for this technique
skill.examples?.p5;        // p5.js algorithm example

API Reference

Interfaces

Interface	Description
RendererAdapter	Contract for rendering engines — validate, compile, mount, capture, export
SketchInstance	Live sketch — mount/unmount, updateState, pause/resume, captureFrame
SkillDefinition	Design knowledge skill — theory, principles, references, examples
SkillReference	Academic citation (title, author, year)
ValidationResult	Algorithm validation result (valid + errors[])
RuntimeDependency	CDN dependency for standalone HTML export (name, version, cdnUrl)
CaptureOptions	Screenshot options (format, quality, scale)
CompiledAlgorithm	Opaque compiled algorithm handle

Classes

Class	Description
RendererRegistry	Register and resolve renderer adapters by type
SkillRegistry	Register and resolve design knowledge skills

Factory Functions

Function	Description
createDefaultRegistry()	Registry pre-loaded with all 5 renderer adapters
createDefaultSkillRegistry()	Registry pre-loaded with all 11 skills

Utilities

Function	Description
hexToVec3(hex)	Convert "#rrggbb" to [r, g, b] floats in [0, 1] — for GLSL uniforms

Re-exports from @genart-dev/format

All types and functions from @genart-dev/format are re-exported: parseGenart, serializeGenart, parseWorkspace, serializeWorkspace, convertLegacySketch, CANVAS_PRESETS, resolvePreset, SketchDefinition, WorkspaceDefinition, ParamDef, ColorDef, and more. See the format README for the full list.

Related Packages

Package	Purpose
@genart-dev/format	File format types, parsers, presets (dependency)
@genart-dev/mcp-server	33-tool MCP server + CLI (depends on core)

Support

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

License

MIT