Skip to main content
Kritzel

Kritzel is framework-agnostic canvas library that helps you build agentic whiteboard experiences with React, Vue and Angular.

Demo Get started
$npm i @kritzel/cli
Running shoe with red accents on a white background
Running shoe with red accents on a white background

Features

Ready made chatbox component

Drop a chatbox onto the canvas that lets users talk to your agent right next to their work, with no extra UI to build.

Programmable cursors

Give your agent its own cursor and move it across the canvas from code, so users can watch it draw, select and edit in real time.

WebMCP ready

Kritzel exposes the canvas as WebMCP tools, so browser agents can read, draw on and edit the whiteboard directly.

Dedicated Kritzel Skill

Install the Kritzel skill with one command and your coding agent knows the Kritzel API, so it can build and extend your canvas for you.

LLM generated objects

Place dynamic objects on the canvas that render content generated by an LLM. Ask for a calculator and the generated web app lands on the board, ready to use.

Programmable canvas

Drive the whole canvas from code: create, move and delete objects, control the viewport and react to every change, so your app and your agents stay in control.

Agents love Kritzel

Add the Kritzel skill to your coding agent, so it knows how to build and extend your canvas right away.

~/my-app npx skills add kasual1/kritzel
██╗ ██╗██████╗ ██╗████████╗███████╗███████╗██╗ ██║ ██╔╝██╔══██╗██║╚══██╔══╝╚══███╔╝██╔════╝██║ █████╔╝ ██████╔╝██║ ██║ ███╔╝ █████╗ ██║ ██╔═██╗ ██╔══██╗██║ ██║ ███╔╝ ██╔══╝ ██║ ██║ ██╗██║ ██║██║ ██║ ███████╗███████╗███████╗ ╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═╝ ╚══════╝╚══════╝╚══════╝
Welcome to kritzel.io
? Install the kritzel skill for your agent? › Yes
✔ Added the kritzel skill to your agent
~/my-app

Frequently Asked Questions

Answers to common questions about building agentic canvases with Kritzel.