Edit videos. In your browser.
FreeCut is a browser-based multi-track video editor. No installation, no uploads — everything runs locally in your browser using WebCodecs, OPFS, and the File System Access API.
- Multi-track timeline with video, audio, text, image, and shape tracks
- Track groups with mute/visible/locked propagation
- Trim, split, join, ripple delete, and rate stretch tools
- Per-track "Close Gaps" to remove empty space between clips, packing them left toward frame 0
- Filmstrip thumbnails and audio waveform visualization
- Pre-compositions (nested compositions, 1 level deep)
- Markers for organizing your edit
- Source monitor with mark in/out via playhead or skimmer and insert/overwrite edits
- Undo/redo with configurable history depth
- CSS filter effects — brightness, contrast, saturation, blur, hue rotate, grayscale, sepia, invert
- Glitch effects — RGB split, scanlines, color glitch
- Canvas effects — halftone (dots, lines, rays, ripples)
- Overlay effects — vignette with configurable shape, softness, and color
- Presets — vintage, noir, cold, warm, dramatic, faded
- Keyframe animation — Bezier curve editor, easing functions (linear, ease-in/out, cubic-bezier, spring), auto-keyframe mode
- Transitions — fade, wipe, slide, 3D flip, clock wipe, iris — each with directional variants and adjustable duration/alignment
- Real-time canvas preview with transform gizmo (drag, resize, rotate)
- Frame-accurate playback via custom Clock engine
- Snap guides and timecode display
- In-browser rendering via WebCodecs (no server required)
- Video: MP4, MOV, WebM, MKV
- Audio-only: MP3, AAC, WAV
- Codecs: H.264, H.265, VP8, VP9, ProRes (proxy through 4444 XQ)
- Quality presets: low, medium, high, ultra
- Import via File System Access API — files are referenced, never copied
- Video: MP4, WebM, MOV, MKV
- Audio: MP3, WAV, AAC, OGG, Opus
- Image: JPG, PNG, GIF (animated), WebP
- Up to 5 GB per file
- OPFS proxy video generation for smooth preview
- Media relinking for moved or deleted files
- Native SVG shapes — rectangle, circle, triangle, ellipse, star, polygon, heart
- Text overlays with custom fonts, colors, and positioning
- Project bundles — export/import projects as ZIP files with Zod-validated schemas
- IndexedDB persistence with content-addressable storage
- Auto-save
- Configurable settings (FPS, snap, waveforms, filmstrips, preview quality, export defaults, undo depth, auto-save interval)
Prerequisites: Node.js 18+
git clone https://github.com/walterlow/freecut.git
cd freecut
npm install
npm run devOpen http://localhost:5173 in Chrome.
- Create a project from the projects page
- Import media by dragging files into the media library
- Drag clips to the timeline — trim, arrange, add effects and transitions
- Animate with the keyframe editor
- Preview your edit in real time
- Export directly from the browser
Chrome 102+ required. FreeCut uses WebCodecs, OPFS, and the File System Access API which are not yet available in all browsers.
Brave disables the File System Access API by default. To enable it:
- Navigate to
brave://flags/#file-system-access-api - Change the setting from Disabled to Enabled
- Click Relaunch to restart the browser
| Action | Shortcut |
|---|---|
| Play / Pause | Space |
| Previous / Next frame | Left / Right |
| Go to start / end | Home / End |
| Split at playhead | Alt+C |
| Join clips | J |
| Delete selected | Delete |
| Ripple delete | Ctrl+Delete |
| Freeze frame | Shift+F |
| Undo / Redo | Ctrl+Z / Ctrl+Y |
| Copy / Cut / Paste | Ctrl+C / Ctrl+X / Ctrl+V |
| Selection tool | V |
| Razor tool | C |
| Rate stretch tool | R |
| Toggle snap | S |
| Add / Remove marker | M / Shift+M |
| Add keyframe | K |
| Toggle keyframe editor | Ctrl+K |
| Group / Ungroup tracks | Ctrl+G / Ctrl+Shift+G |
| Mark In / Out (playhead) | I / O |
| Mark In / Out (skimmer) | Shift+I / Shift+O |
| Insert / Overwrite edit | , / . |
| Save | Ctrl+S |
| Export | Ctrl+E |
| Zoom to fit | Z |
- React 19 + TypeScript
- Vite — build tool with HMR
- Zustand + Zundo — state management with undo/redo
- TanStack Router — file-based type-safe routing
- Tailwind CSS 4 + shadcn/ui — styling and UI components
- Mediabunny — media decoding and metadata extraction
- Canvas + WebCodecs — composition rendering and export
- OPFS + IndexedDB — local persistence
- Web Workers — heavy processing off the main thread
npm run dev # Dev server on port 5173
npm run build # Production build
npm run lint # ESLint
npm run test # Vitest (watch mode)
npm run test:run # Vitest (single run)
npm run test:coverage # Vitest with coverage
npm run routes # Regenerate TanStack Router route treeVITE_SHOW_DEBUG_PANEL=true # Show debug panel in dev (default: true)src/
├── features/
│ ├── editor/ # Editor shell, toolbar, panels, stores
│ ├── timeline/ # Multi-track timeline, actions, services
│ ├── preview/ # Preview canvas, transform gizmo
│ ├── player/ # Playback engine (Clock, composition)
│ ├── export/ # WebCodecs export pipeline (Web Worker)
│ ├── effects/ # Visual effects (CSS filters, glitch, halftone, vignette)
│ ├── keyframes/ # Keyframe animation, Bezier editor, easing
│ ├── media-library/ # Media import, metadata, OPFS proxies
│ ├── project-bundle/ # Project ZIP export/import
│ ├── projects/ # Project management
│ └── settings/ # App settings
├── lib/
│ ├── composition-runtime/ # Sequence/Item primitives
│ ├── transitions/ # Transition renderers (CSS + canvas)
│ ├── storage/ # IndexedDB persistence
│ ├── shapes/ # SVG shape generators
│ ├── fonts/ # Font loader
│ ├── migrations/ # Data migration system
│ └── debug/ # Debug utilities
├── components/ui/ # shadcn/ui components
├── config/hotkeys.ts # Keyboard shortcut definitions
├── routes/ # TanStack Router (file-based)
└── types/ # Shared TypeScript types
- Report bugs — open an issue
- Suggest features — start a discussion
![@coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=64&v=4){kind=small}