gitwtfhub

wtf is canvas-hand?

tasihi89/canvas-hand — explained in plain English

Analysis updated 2026-05-18

165JavaScriptAudience · vibe coderComplexity · 2/5Setup · easy

TL;DR

Canvas Hand adds a local drawing canvas to Codex, letting you generate images, mark them up with arrows, and have the AI redraw them.

Mindmap

mindmap
  root((Canvas Hand))
    What it does
      Local infinite canvas
      Generate then annotate images
      AI redraws from annotations
    Tech stack
      JavaScript
      tldraw
      Vite
    Use cases
      Iterate on generated images
      Mark up images with arrows
      Keep a persistent canvas
    Audience
      Codex users
      Designers
    Setup
      Clone plugin folder
      Edit config files or ask Codex

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Generate an image inside Codex and place it directly onto a persistent local canvas.

REASON 2

Draw arrows and notes on a generated image to tell the AI exactly what to change.

REASON 3

Iterate on the same image across several rounds while keeping earlier versions visible side by side.

REASON 4

Keep one reusable canvas of generated images and annotations saved locally on your machine.

What's in the stack?

JavaScripttldrawVite

How it stacks up

tasihi89/canvas-handsiigari/claude-heartbeat7-e1even/learn-agent
Stars165161160
LanguageJavaScriptJavaScriptJavaScript
Setup difficultyeasymoderateeasy
Complexity2/53/52/5
Audiencevibe coderdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · easy Time to first run · 5min

Requires Codex with plugin support, dependencies for the local canvas service install automatically on first use.

No license information is stated in the README.

Wtf does this do

Canvas Hand is a plugin for Codex that adds a local infinite drawing canvas, built on the tldraw library, to Codex's own sidebar browser. It lets you generate images with Codex's built-in image model, place them on the canvas, and then draw arrows and notes directly on an image to tell the AI what to change. Codex reads those annotations and redraws the image accordingly, placing the new version next to the original rather than replacing it, so you can keep iterating on an image over several rounds. The canvas runs as a small local web service on your own machine, by default at address 127.0.0.1 port 8000, and its data is saved to a fixed folder on your computer, so you always come back to the same canvas. Only the arrows drawn on the most recently generated image are used when you ask for a redraw, which keeps each round focused on the image you just made. Installing it means cloning the plugin's code to a folder on your machine and registering it with Codex, either by asking Codex to do the setup itself, since the plugin includes instructions written for that purpose, or by manually editing two configuration files, a marketplace file and a config file, then restarting Codex. No separate install step is needed for the canvas's own dependencies, since they install automatically the first time you open it. Once installed, you open the canvas by asking Codex in plain language, generate an image by describing what you want, and revise an image by drawing an arrow with the canvas's "revise instruction" pen and telling Codex to redraw based on your annotations. The project ships as a set of three focused skill files that Codex routes between depending on what you are asking for.

Yoink these prompts

Prompt 1
Help me install the Canvas Hand plugin for Codex by editing the config files myself.
Prompt 2
Generate a phone ad poster on my canvas using Canvas Hand.
Prompt 3
Explain how Canvas Hand decides which annotations to use when redrawing an image.
Prompt 4
Walk me through opening the canvas and redrawing an image based on my arrow annotations.

Frequently asked questions

wtf is canvas-hand?

Canvas Hand adds a local drawing canvas to Codex, letting you generate images, mark them up with arrows, and have the AI redraw them.

What language is canvas-hand written in?

Mainly JavaScript. The stack also includes JavaScript, tldraw, Vite.

What license does canvas-hand use?

No license information is stated in the README.

How hard is canvas-hand to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is canvas-hand for?

Mainly vibe coder.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.