Overview

Kritzel is a framework-agnostic infinite canvas and collaborative whiteboard engine. It provides web components that work natively in any framework, with a first-class React wrapper for idiomatic JSX integration.

Kritzel handles the hard parts of canvas-based applications, including infinite pan and zoom, hit-testing, CRDT-based collaboration, undo and redo, and cross-browser rendering, so you can focus on your product's domain logic.

If you are just getting started, jump to the Quick Start guide to get a simple editor up and running. Otherwise, explore the building blocks below to learn how Kritzel is structured.

Building Blocks

The library is composed of a small set of core concepts that work together to power your canvas experience:

Components

Core Concept

Two entry points, a batteries-included editor and a headless engine, to match any integration style.

Tools

Core Concept

State-machine interaction handlers that define how users draw, select, and manipulate the canvas.

Objects

Core Concept

The visual building blocks on the canvas, such as paths, shapes, text, and images with shared spatial properties.

Workspaces

Core Concept

Containers that manage an entire canvas collection, view state, and editor configuration.

Theming

Customization

Built-in light and dark themes with full CSS variable customization to match your brand.

Collaboration

Customization

Real-time multi-user sync powered by Yjs CRDTs with pluggable transport providers.