Veyrajs

A typed, mutable 2D canvas engine — scene graph, camera, federated events, hit-testing, transforms, versioned serialization, and day-one undo. One engine, four framework adapters.

Get started GitHub

Try it live

Why Veyrajs

Typed scene graph

Stage → Layer → Group/Shape → Node. Real classes you mutate, with guarded setters and lazy, version-counted world transforms.

Renderer abstraction

Nodes emit backend-neutral draw ops — Canvas 2D today, a WebGL/WebGPU seam reserved for tomorrow. No node ever touches a raw 2D context.

Federated events

DOM-style capture → target → bubble, plus derived click / drag* / pointerenter|leave / wheel gestures.

Zoom-aware hit-testing

Geometric picking with an AABB prefilter and a grab tolerance that stays constant in screen pixels at any zoom.

Undo from day one

Every meaningful mutation is a reversible, serializable command. Selection drags are undoable transactions.

Four adapters

Vue, React, Svelte & Angular — declarative components over the same engine, with zero core changes.

One engine, four frameworks

The demo above is the raw imperative engine. The same scene can be built declaratively in any of the four supported frameworks — see Adapters. Veyrajs’s core is fully framework-agnostic; each adapter is a thin, parallel sibling that wraps it.

Explore the docs

Getting Started

Build your first interactive scene in a few lines, imperatively or with an adapter. Start here →

Core Concepts

Scene graph, shapes, camera, events, hit-testing, selection, undo, and serialization — each with a live demo. Learn the engine →

Framework Adapters

React, Vue, Svelte, and Angular components — with live islands you can click. Pick your framework →

API Reference

Every export of @veyrajs/core, grouped by module. Look it up →

Recipes

Pan & zoom, free drawing, save/load, export to PNG, annotation boxes, and more. Copy a recipe →

Advanced

Custom renderers, hit-testers, node types, performance, and schema migrations. Go deeper →