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 WebGPU, 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
- Rolling edit, ripple edit, slip, and slide tools
- Per-track "Close Gaps" to remove empty space between clips
- 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
All visual effects are WebGPU-accelerated.
- Blur — gaussian, box, motion, radial, zoom
- Color — brightness, contrast, exposure, hue shift, saturation, vibrance, temperature/tint, levels, curves, color wheels, grayscale, sepia, invert
- Distortion — pixelate, RGB split, twirl, wave, bulge/pinch, kaleidoscope, mirror, fluted glass
- Stylize — vignette, film grain, sharpen, posterize, glow, edge detect, scanlines, color glitch
- Keying — chroma key (green/blue screen) with tolerance, softness, and spill suppression
25 GPU-accelerated blend modes: normal, darken, multiply, color burn, linear burn, lighten, screen, color dodge, linear dodge, overlay, soft light, hard light, vivid light, linear light, pin light, hard mix, difference, exclusion, subtract, divide, hue, saturation, color, luminosity.
Layer masks with keyframeable geometry transforms for compositing and selective effect application.
- CPU transitions — fade, wipe, slide, 3D flip, clock wipe, iris — each with directional variants
- GPU transitions — dissolve, sparkles, glitch, light leak, pixelate, chromatic aberration, radial blur
- Adjustable duration and alignment
- Bezier curve editor with preset easing functions
- Easing: linear, ease-in, ease-out, ease-in-out, cubic-bezier, spring
- Auto-keyframe mode with dopesheet toggle
- Graph editor, dopesheet, and split view
- Real-time WebGPU-composited preview with transform gizmo (drag, resize, rotate)
- Frame-accurate playback via custom Clock engine
- GPU scopes — waveform, vectorscope, histogram
- Snap guides and timecode display
- In-browser rendering via WebCodecs (no server required)
- Video containers: MP4, WebM, MOV, MKV
- Video codecs: H.264, H.265, VP8, VP9, AV1
- Audio codecs: AAC, Opus, MP3, FLAC, PCM (WAV)
- Quality presets: low (2 Mbps), medium (5 Mbps), high (10 Mbps), ultra (20 Mbps)
- 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
- Scene detection and optical flow analysis
- Browser-based speech-to-text via Whisper (runs locally in a Web Worker)
- Models: tiny, base, small, medium, large
- Auto-generate caption text items from transcripts
- Multi-language support
- 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
- Customizable keyboard shortcuts with preset import/export
- 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 113+ required. FreeCut uses WebGPU, 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 |
| Previous / Next snap point | Up / Down |
| Go to start / end | Home / End |
| Split at playhead | Ctrl+K |
| Split at cursor | Shift+C |
| Join clips | Shift+J |
| Delete selected | Delete |
| Ripple delete | Ctrl+Delete |
| Freeze frame | Shift+F |
| Nudge item (1px / 10px) | Shift+Arrow / Ctrl+Shift+Arrow |
| Undo / Redo | Ctrl+Z / Ctrl+Shift+Z |
| Copy / Cut / Paste | Ctrl+C / Ctrl+X / Ctrl+V |
| Selection tool | V |
| Razor tool | C |
| Rate stretch tool | R |
| Rolling edit tool | N |
| Ripple edit tool | B |
| Slip tool | Y |
| Slide tool | U |
| Toggle snap | S |
| Add / Remove marker | M / Shift+M |
| Previous / Next marker | [ / ] |
| Add keyframe | A |
| Clear keyframes | Shift+A |
| Toggle keyframe editor | Ctrl+Shift+A |
| Keyframe view: graph / dopesheet / split | 1 / 2 / 3 |
| Group / Ungroup tracks | Ctrl+G / Ctrl+Shift+G |
| Mark In / Out | I / O |
| Clear In/Out | Alt+X |
| Insert / Overwrite edit | , / . |
| Zoom in / out | Ctrl+= / Ctrl+- |
| Zoom to fit | \ |
| Zoom to 100% | Shift+\ |
| Save | Ctrl+S |
| Export | Ctrl+Shift+E |
- React 19 + TypeScript
- Vite — build tool with HMR
- WebGPU — GPU-accelerated effects, compositing, and scopes
- 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
- 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 check:boundaries # Feature boundary architecture check
npm run check:deps-contracts # Enforce deps contract seam routing
npm run check:legacy-lib-imports # Block any "@/lib/*" usage
npm run check:deps-wrapper-health # Fail on unused pass-through deps wrappers
npm run check:edge-budgets # Feature seam coupling budget check
npm run report:feature-edges # Feature dependency edge report
npm run report:feature-edges:json # JSON feature edge report
npm run report:deps-wrapper-health:json # JSON deps wrapper health report
npm run verify # Boundaries + deps contracts + no-lib guard + wrapper health + edge budgets + lint + build
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/
|- app/ # App bootstrap and providers
|- domain/ # Framework-agnostic domain logic
| |- animation/ # Easing functions and interpolation
| |- projects/ # Project domain types
| \- timeline/ # Transitions (engine, registry, renderers)
|- infrastructure/ # Browser/storage/GPU adapters
|- lib/
| |- gpu-effects/ # WebGPU effect pipeline + shader definitions
| |- gpu-transitions/ # WebGPU transition pipeline + shaders
| |- gpu-compositor/ # WebGPU blend mode compositor
| |- gpu-scopes/ # WebGPU waveform/vectorscope/histogram
| |- masks/ # Mask texture management
| |- analysis/ # Optical flow and scene detection
| |- thumbnails/ # GPU-accelerated thumbnail renderer
| |- fonts/ # Font loading
| |- shapes/ # Shape path generators
| \- migrations/ # Data migration system
|- features/
| |- editor/ # Editor shell, toolbar, panels, stores
| |- timeline/ # Multi-track timeline, actions, services
| |- preview/ # Preview canvas, transform gizmo, GPU scopes
| |- player/ # Playback engine (Clock, composition)
| |- composition-runtime/ # Composition rendering (sequences/items/audio/transitions)
| |- export/ # WebCodecs export pipeline (Web Worker)
| |- effects/ # GPU effect system and UI panels
| |- keyframes/ # Keyframe animation, Bezier editor, easing
| |- media-library/ # Media import, metadata, OPFS proxies, transcription
| |- project-bundle/ # Project ZIP export/import
| |- projects/ # Project management
| \- settings/ # App settings, keyboard shortcut editor
|- shared/ # Shared UI/state/utilities across layers
|- components/ui/ # shadcn/ui components
|- config/hotkeys.ts # Keyboard shortcut definitions
|- routes/ # TanStack Router (file-based)
\- types/ # Shared TypeScript types
Architecture boundary policy and migration plan: docs/architecture-boundaries.md
FreeCut is open source but not open contribution — pull requests are not accepted at this time.
- Report bugs — open an issue
- Suggest features — start a discussion
