Open Source Canvas

The graph is the studio.
An open-source node canvas for images and video, on your own GPU with ComfyUI.

Live demo · Demo video · Docs · Quick start

Prompts, references and models go in on one infinite board; finished images and clips come out. Nothing is generated in the browser: the app talks to a ComfyUI server you run, and builds the workflow for each model for you.

The live demo is for looking around only: ComfyUI is offline there, so Run draws placeholder artwork. Run the app locally for real generations.

_{Music Video (night) and Marketing Studio (day). The example boards ship with their finished outputs.}

• Boards, not workflows. Prompt, Image, Model, Output and Note nodes with typed connections. Templates for a music video, a marketing film, a recreate and more.
• @ references. Write "@Avatar opens @Product" in a prompt and it points at those reference nodes.
• Every render kept. Each node has a History strip; batch renders get their own seeds.
• Chains. An image from one node becomes the next node's reference or first frame.
• Teamwork. Comments and reactions that pin to nodes, plus an optional room (npm run room) that syncs a board.
• Local first. Boards autosave in your browser, export as JSON, and follow your light or night theme.

You are welcome to try Pika H3 Flex, Pika Labs' open video model with audio, on your own GPU. It is in the model list, and the app shows which files to install (no custom node; you need ComfyUI 0.43.2 or newer, then follow ComfyUI's Pika H3 Flex guide). The canvas has no workflow for it yet, so for now render it with ComfyUI's built-in Pika H3 Flex templates. A workflow so the canvas can run it directly is a very welcome pull request (how to add a model).

You need Node.js 20 or newer and a recent ComfyUI (0.40 or newer recommended). SD-Turbo (images) runs on almost anything, including Apple Silicon; the default LTX-Video 2B (video) needs about 24 GB of GPU or unified memory. Plan for about 16 GB of disk.

git clone https://github.com/raph651/open-source-canvas.git
cd open-source-canvas
npm install

1. ComfyUI. If you already run it, skip ahead. Otherwise one script clones it next to this repo, sets up Python with uv and downloads the models:

./scripts/setup-comfyui.sh --with-video      # leave the flag off for images only

Prefer to do it by hand? See docs/SETUP.md. Start ComfyUI with CORS on so the browser may call it:

python main.py --enable-cors-header

2. The app.

npm run dev        # http://127.0.0.1:4173

3. Check the link. Click the ComfyUI badge in the top bar: it should say Connected with your device and version.

4. Make something. Open a template or choose New canvas, connect a Prompt node to a Model node, and press Generate. For video, connect an image into the node and it becomes the first frame. A 512×512 SD-Turbo image takes roughly 10 to 20 seconds on an Apple M-series chip; a short LTX-Video clip takes a minute or two.

For a production-style run, npm run build then node server/app.mjs serves the built app and proxies ComfyUI at /comfy, so no CORS flag is needed.

Add your own local model with docs/ADDING_MODELS.md.

Licenses. The app is MIT. Models are separate, so read each model card before commercial use:

• The badge says offline. ComfyUI is not running, or the dev server cannot reach it. Start ComfyUI with --enable-cors-header, or use node server/app.mjs, which proxies it, and check the base URL in the ComfyUI panel.
• /prompt failed (400) or "model not found". A file name in the ComfyUI panel does not match a file in models/checkpoints/ or models/text_encoders/. Copy the exact names.
• Out of memory on video. Keep Fast local video on, use a shorter clip, or run it on a machine with more memory.
• 403 from /comfy/... on a shared deployment. The proxy refused a request for someone else's output, or a gateway such as Cloudflare Access blocked it. See deploy/README.md.

• docs/SETUP.md: manual ComfyUI install, connecting to a remote server, environment variables, hosted API models, project layout, scripts
• docs/COMFYUI_RUNTIME.md: how a render flows through the code
• docs/ADDING_MODELS.md: add a local model
• deploy/README.md: share a running copy behind Cloudflare Tunnel and Access
• CHANGELOG.md: what changed in each version

MIT. See LICENSE. Built with ComfyUI, React Flow, React, Vite and Zustand.