Timeline Studio — Browser AI Video Editor
English | 中文 | 日本語 | 한국어 | Español | Français | Deutsch | Português | ไทย | Tiếng Việt | Русский
Timeline Studio is a local-first AI video editor that runs in the browser. It combines a CapCut-style multi-track timeline with browser-side AI voiceovers, automatic captions, vision tools, talking-avatar generation, and deterministic offline export.
Open the editor · Watch the demo · Hugging Face Space
AI capabilities
- Multilingual voiceover: Chinese Piper/VITS ONNX voices, English Kokoro 82M, and browser Piper voices for German, Spanish, French, Italian, and Brazilian Portuguese.
- Automatic captions: Whisper small q8 ONNX with waveform-aware timing and conservative Chinese recognition cleanup.
- Smart framing: YOLOS tiny subject detection and MODNet portrait matting for smart crop, caption avoidance, and background removal across images and complete videos.
- AI vocal separation: isolate vocals and place the instrumental stem on the music track without leaving the browser workflow.
- Digital human: JoyVASA audio-to-motion and LivePortrait neural rendering with WebGPU, 256px preview and 512px quality paths.
- Local-first inference: large models are lazy-loaded, revision-pinned, and cached by the service worker; supported workflows run without uploading project media to an editing backend.
Editing and export
- Contiguous main Visuals track plus timed picture-in-picture overlays.
- Direct canvas selection, movement, proportional resize, rotation, masks, filters, effects, animation, speed, and explicit keyframes.
- Captions, stickers, voiceover, separated source audio, and music on independent timed tracks.
- CapCut-style snapping, alignment guides, clip menus, split/duplicate/delete, timeline zoom, undo/redo, and portable
.timelineprojects. - Native media playback for a responsive preview; export uses a separate deterministic offline rendering path.
- WebCodecs MP4/WebM composition with shared preview/export geometry, audio mixing, captions, overlays, effects, and MediaRecorder fallback.
- Installable PWA with a cached app shell and multilingual UI.
Agent Skill
The repository includes edit-timeline-studio, a Codex-compatible Skill for planning, executing, and verifying editable video timelines.
It helps an agent:
- inspect media and preserve the user's editing brief;
- describe reversible edits with stable clip IDs and explicit timestamps;
- operate the hosted or local editor through the browser compatibility path;
- validate declarative edit plans with
skills/edit-timeline-studio/scripts/validate_edit_plan.mjs; - verify track placement, transitions, captions, overlays, audible audio, and final export artifacts;
- keep the editable
.timelineproject as the source of truth instead of returning only an opaque render.
The current Skill is honest about its boundary: browser-driven editing is available today, while the versioned headless command runner described in its command contract is the next automation layer.
Install through the public skills.sh directory (the current CLI requires Node.js 22.20.0 or later):
npx skills add MartinDelophy/ai-video-editor --skill edit-timeline-studio
Or install it with GitHub CLI 2.90.0 or later:
# Claude Code
gh skill install MartinDelophy/ai-video-editor edit-timeline-studio --agent claude-code --scope user
# Codex
gh skill install MartinDelophy/ai-video-editor edit-timeline-studio --agent codex --scope user
To install the tested release instead of following the latest release, add --pin v0.6.1. Preview the Skill before installing with:
gh skill preview MartinDelophy/ai-video-editor edit-timeline-studio
Roadmap
- Now: harden deterministic offline export, improve timeline editing reliability, and expand end-to-end browser tests.
- Next: ship the versioned headless command runner for agent-driven editing and make reusable project templates easier to share.
- Later: add collaborative review workflows, a plugin extension surface, and more locally verified AI models.
Roadmap priorities are shaped in GitHub Discussions. Feature requests and real-world workflow feedback are welcome.
Help wanted
Timeline Studio is looking for contributors interested in browser media, WebCodecs, WebGPU/ONNX, timeline UX, localization, testing, and documentation.
- Try the live editor and report reproducible bugs in Issues.
- Join Discussions to propose features, share projects, or help prioritize the roadmap.
- Contributions of focused fixes, tests, translations, documentation, and example projects are especially useful.
Quick start
Requirements: Node.js 20+ and a modern Chromium browser. WebGPU is recommended for the heaviest AI workflows.
git clone https://github.com/MartinDelophy/ai-video-editor.git
cd ai-video-editor
npm install
npm run dev
Open the local URL printed by Vite. The first AI run may download model files; later runs reuse the browser cache.
Validate and build
npm test
npm run build
npm run preview
Run the complete repository check with:
npm run check
Deploy
The included netlify.toml builds with npm run build, publishes dist, enables the cross-origin isolation headers required by browser AI/media workers, and provides the SPA fallback.
npx netlify-cli deploy --prod --dir=dist
Support and feedback
If this project helps you, please consider giving it a ⭐ Star. If you encounter a problem, please open an Issue.
Join our Discord community to ask questions, share feedback, and connect with other users and contributors.