Show HN: Repliflow – a node canvas for chaining Replicate image and video models

tommyjepsen2 pts0 comments

GitHub - tommyjepsen/repliflow: Node-based orchestration of video and image generation based on Replicate · GitHub

/" data-turbo-transient="true" />

Skip to content

Search/

Sign in<br>Sign upAppearance settings

You signed in with another tab or window. Reload to refresh your session.<br>You signed out in another tab or window. Reload to refresh your session.<br>You switched accounts on another tab or window. Reload to refresh your session.

Dismiss alert

{{ message }}

tommyjepsen

repliflow

Public

Notifications<br>You must be signed in to change notification settings

Fork

Star

main

BranchesTags

Go to file

CodeOpen more actions menu

Folders and files<br>NameNameLast commit message<br>Last commit date<br>Latest commit

History<br>3 Commits<br>3 Commits

public

public

src

src

.gitignore

.gitignore

.oxlintrc.json

.oxlintrc.json

README.md

README.md

components.json

components.json

example-of-repliflow.png

example-of-repliflow.png

index.html

index.html

package-lock.json

package-lock.json

package.json

package.json

tsconfig.app.json

tsconfig.app.json

tsconfig.json

tsconfig.json

tsconfig.node.json

tsconfig.node.json

vite.config.ts

vite.config.ts

View all files

Repository files navigation

Repliflow

A node canvas for generating images, video, audio and 3D with<br>Replicate. Wire a prompt into a model, wire that model's output<br>into the next one, and keep the whole chain on one canvas instead of in a folder of downloads.

npm install<br>npm run dev

Then add your Replicate API token via the key icon in the left rail. Grab one at<br>replicate.com/account/api-tokens. It is kept in<br>localStorage and never leaves your machine except as the Authorization header on proxied<br>API calls.

The canvas

Right-click the canvas to open the node menu — search across the whole catalog, or drill into<br>Image / Video / Audio / 3D / Utility → group → model, plus local Effects.<br>The bottom toolbar switches between select and pan, adds nodes, fits the view, and zooms.

There are four kinds of node:

Prompt holds text. The Start from a template dropdown appends a written-out starting<br>prompt — photography, illustration or motion — rather than replacing what you already typed.<br>Drag its right handle into a model node to feed it.

Image is your own image: upload a file or paste a URL. Uploads stay local.

Model shows the model's real inputs, runs the prediction, and previews the result inline<br>(image, video, audio player, 3D download, or text). If a price is known it is shown next to<br>the name, and the model page is one click away.

Effect applies a local pixel transform — see below.

Each media input on a model node has its own target handle, so you can drop an edge straight onto<br>image or last image and control first-frame/last-frame wiring explicitly. When a prompt node<br>is connected, the model node still offers a small Add to it field: what you type there is sent<br>as the connected prompt plus your addition on a new line, so one prompt can drive several variants.

Chaining works by output type: an image node feeds anything with an image input, an audio node<br>feeds a lipsync model, a captioning model's text feeds a prompt input, and so on.

Starter templates

An empty canvas offers a few pre-wired graphs instead of a blank page —<br>prompt → image, prompt → video, image → image (Flux Kontext), image → video (Kling), generate then<br>cut the background out, and a cheap video test that iterates prompts on Wan before you pay for<br>Veo or Sora. They are defined in src/lib/templates.ts.

Effects

The Effects section of the node menu holds local image transforms — halftone, ASCII, dither,<br>pixelate, posterize, duotone, scanlines. These are deterministic pixel operations, so they run on<br>a canvas in the browser rather than as predictions: instant, free, and repeatable. Parameters<br>re-apply live as you drag them.

Because reading pixels needs a same-origin image, effect nodes work from the cached blob rather<br>than the delivery URL. Each effect node keeps one asset (re-running overwrites it) so tweaking a<br>slider doesn't flood the gallery. Feeding an effect result back into a Replicate model works —<br>the blob is converted to a data URI on the way out.

Add one in src/lib/effects.ts: a name, a parameter list, and an apply that draws to a canvas.

Projects

Projects are stored in IndexedDB and autosave about half a second after you stop editing. The<br>Projects panel in the left rail switches, creates, duplicates, renames and deletes them; the<br>last opened project reopens on launch.

Generated files are downloaded and cached as blobs alongside the project, because Replicate's<br>delivery URLs expire roughly an hour after a run. If that download is blocked, the node falls<br>back to the remote URL and the preview will break once it expires.

Gallery and saving files

The Gallery panel lists every generation newest-first, scoped to all projects or just this<br>one, with previews, re-download and delete.

Auto-download can be toggled there. By default files land in your normal...

node image json model prompt canvas

Related Articles