FableCut
A browser video editor that AI agents can drive.
FableCut is a Premiere-style non-linear video editor that runs entirely in your
browser — and exposes its whole timeline as one JSON document. Edit it by hand,
from the UI, or let an AI agent (Claude Code, Claude Desktop, or anything that
speaks MCP/REST) cut your video for you while you watch the timeline update
live.
Zero npm dependencies. One node server.js. That's it.
Why it's interesting
Most "AI video" tools hide the edit behind an API. FableCut flips that: the
project file is the interface. project.json describes media, clips,
tracks, effects, keyframes and transitions — any process that can write JSON
can edit video, and the open browser UI hot-reloads within ~150 ms via
server-sent events. A human and an agent can work on the same timeline at the
same time.
Features
Editing
4 video tracks + 3 audio tracks, drag/trim/split/snap, undo/redo
Timeline multi-select — rubber-band marquee (drag on empty track area),
Ctrl/Cmd/Shift+click to add/remove clips, Ctrl+A to
select all, Esc to deselect. Drag any selected clip to move the
whole group; Delete removes all selected; S splits all
selected at the playhead. Inspector shows an "N clips selected" banner.
Beat & cue markers (tap M on the beat during playback) with edge snapping
Real decoded audio waveforms on clips
Canvas aspect presets (16:9, 9:16 reels, 4:5, 1:1) + safe-area guides
Look
12 one-click filter presets (cinematic, teal-orange, noir, vintage, cyberpunk…)
Adjustment layers — one clip grades everything below it, Premiere-style
Full grade controls: brightness/contrast/saturation/hue, temperature & tint,
blur, grayscale/sepia/invert, vignette, animated film grain
Blend modes (screen, multiply, overlay…), fit modes (contain/cover/stretch),
per-edge cropping, corner radius, flip H/V
Chroma key (green screen) with tolerance/softness + spill suppression
AI background removal (person cut-out, in-browser via MediaPipe)
Motion
Keyframe animation on ~25 properties with easing
Speed ramps — keyframe speed and the engine time-remaps video and the
export audio mix (the fast-into-slow-mo reel move)
Camera shake and RGB-split/chromatic aberration, both animatable
17 transitions: fades, slides, wipes (4 directions), zoom, iris, spin, blur,
whip-pan, glitch, pop
Text
Kinetic captions: typewriter, word-pop, word-slide, karaoke, letter-pop,
wave, bounce, shake
Neon glow for that TikTok caption look
Font editor: system fonts, drop-in custom fonts (library/fonts/), and any
Google Font by name — loaded automatically
Gradient fills, outline, background pills, letter-spacing, line-height,
weights, italic, uppercase, alignment, soft shadows
Animated SVG clips
A first-class svg clip kind: CSS-@keyframes-animated SVGs render
frame-accurately in preview and export (the compositor freezes the
animation at any time). Agents can author their own vector overlays —
lower-thirds, confetti, sparkles — as plain .svg files. Starters included.
Remake a reference video
Give it a reference edit (a reel you like) and get back an edit blueprint:
shot boundaries, music beats + BPM, a loudness curve, per-shot energy, the
drop — plus the reference's music track extracted into your media, ready
to rebuild the same idea with your own footage. Zero extra dependencies
(ffmpeg does the decoding; onset/tempo detection is plain Node).
node analyze.js ref.mp4, POST /api/analyze, or the
fablecut_analyze_reference MCP tool.
Asset library
library/ folders surface as tabs in the UI: Elements (overlay art),
Sound FX, SVG — drop files in, the open editor refreshes live
Export
Fast export: browser renders every frame + an offline audio mix, ffmpeg
encodes a frame-accurate CRF-18 MP4 (keeps rendering if you switch tabs)
Realtime MediaRecorder fallback when ffmpeg isn't available
Quick start
Requirements: Node 18+ and a Chromium-based browser. ffmpeg on PATH is
optional but recommended (fast export + upload remuxing). AI background
removal fetches its model from a CDN on first use.
Drop media into the window (or ./media/), drag clips onto the timeline, edit,
export.
Driving it with an AI agent
Everything an agent needs is in CLAUDE.md — the complete
schema, semantics and recipes. Point any capable model at that file and it can
operate the editor end to end.
Three equivalent control surfaces:
MCP (best for Claude Code / Claude Desktop) — register the bundled
zero-dependency MCP server once:
claude mcp add -s user fablecut -- node "<path-to>/fablecut/mcp-server.js"
Tools: fablecut_status (auto-starts the editor), fablecut_docs,
fablecut_get_project, fablecut_set_project, fablecut_patch_project,
fablecut_import_media, fablecut_analyze_reference.
The surface is token-efficient by design: agents patch the timeline with
small ops (fablecut_patch_project) instead of round-tripping the whole
document, read a compact one-line-per-clip summary
(fablecut_get_project {compact:true}), and fetch only the manual sections
they need (fablecut_docs {section:"props"}).
MCP (best for Claude Code / Claude Desktop) — register the bundled
zero-dependency MCP server once:
Tools: fablecut_status (auto-starts the editor), fablecut_docs,
fablecut_get_project, fablecut_set_project, fablecut_patch_project,
fablecut_import_media, fablecut_analyze_reference.
The surface is token-efficient by design: agents patch the timeline with
small ops (fablecut_patch_project) instead of round-tripping the whole
document, read a compact one-line-per-clip summary
(fablecut_get_project {compact:true}), and fetch only the manual sections
they need (fablecut_docs {section:"props"}).
The file — read project.json, modify, bump revision, write. The UI
live-reloads.
The file — read project.json, modify, bump revision, write. The UI
live-reloads.
REST — GET/PUT /api/project, POST /api/upload, GET /api/library,
SSE at /api/events. See CLAUDE.md for the full list.
REST — GET/PUT /api/project, POST /api/upload, GET /api/library,
SSE at /api/events. See CLAUDE.md for the full list.
Example: ask Claude Code "cut these six clips to the beat markers, add a
teal-orange grade, put a word-pop caption on top and a whoosh on every cut" —
and watch the timeline rebuild itself.
Or hand it a reference: "here's a reel I like — analyze it and remake it with
my clips, same music". The agent calls fablecut_analyze_reference, gets the
blueprint (cuts, beats, BPM, energy, drop, extracted music), and rebuilds the
structure shot-for-shot with your footage.
Conflict-safe concurrent editing: the UI, the MCP tools, and direct
project.json writes all agree on a revision counter. If you edit a clip in
the UI while an agent is mid-task, the agent's next write is rejected (409 from
the REST API / a conflict error from fablecut_set_project) instead of
silently overwriting your change. The UI similarly detects when an agent write
supersedes a not-yet-saved local tweak and tells you with a toast instead of
dropping it silently.
Project layout
Authoring animated SVG overlays
SVGs animate with plain CSS @keyframes. One convention: never hardcode
animation-delay — set --d: 0.4s instead, and the compositor drives time by
pausing all animations and rebasing their delays. Full rules + a skeleton in
CLAUDE.md; working
examples in library/svg/.
Notes
The repo ships with 20 Google Fonts (library/fonts/, OFL — see
LICENSES.md there) and a set of self-authored SVG overlays and animated
elements (library/elements/, library/svg/, MIT like the rest of the repo).
library/sfx/ is yours to fill (gitignored): sound-effect sites typically
don't allow redistributing their files in a public repo, so FableCut doesn't —
library/sfx/README.md lists good free sources.
Export runs in the browser because the compositor is the browser; agents
ask you to click Export (or render directly with ffmpeg from media/).
License
MIT