▶ ClipForge

Free Browser Video Editor — 15 Tools, Zero Uploads

Edit videos entirely in your browser. No server uploads, no accounts, no tracking.

Open the Editor →  ·  Report Bug  ·  Request Feature

---

📋 Short Description

ClipForge is a free, privacy-first video editor that runs 100% in your browser. 15 powerful tools — resize, crop, rotate, flip, reverse, cut, speed, merge, compress, extract audio, mute, watermark, thumbnail, convert & GIF — powered by ffmpeg.wasm. No upload, no server, no account.

---

📖 Long Description

ClipForge is a comprehensive, browser-based video editing toolkit that processes files entirely on the client side using ffmpeg.wasm (WebAssembly). Your media never leaves your device — everything happens locally in the browser tab.

Built as a single-page static site, ClipForge requires no backend, no database, and no user accounts. It's designed to be deployed on GitHub Pages (or any static host) and works offline after the initial asset load.

Whether you need to quickly trim a clip, compress a large recording, rip audio from a video, add a watermark, or convert between formats — ClipForge handles it all from a single tabbed interface. No app install, no subscription, no file size limits imposed by a server.

---

🛠 Tools (15)

Tool	Description
🎞 GIF	Convert video to looping GIF with FPS, width, quality, and duration controls
📐 Resize	Scale video dimensions with optional aspect ratio lock
✂ Crop	Trim the visible frame by width, height, and X/Y offsets
🔄 Rotate	Rotate 90°, 180°, or 270° clockwise
🪞 Flip	Mirror horizontally, vertically, or both
⏪ Reverse	Play video backwards (with audio reversal)
🗜 Cut	Extract a segment with start time and duration (fast or accurate mode)
⚡ Speed	Speed up (0.25×–4×) with synced audio tempo adjustment
🧩 Merge	Concatenate 2+ video files into one continuous clip
📦 Compress	Reduce file size using CRF quality control and encoding presets
🎵 Extract Audio	Rip audio to MP3, WAV, AAC (M4A), or Opus (OGG)
🔇 Mute	Strip the audio track while keeping video quality intact
💧 Watermark	Overlay custom text with position, size, color, and opacity
🖼 Thumbnail	Capture a single frame at any timestamp as PNG or JPEG
🔁 Convert	Re-encode to MP4, WebM, AVI, MOV, MKV, or OGV

---

🚀 Getting Started

Use Online (Recommended)

Just visit clipforge.app — no installation needed.

Run Locally

# Clone the repository
git clone https://github.com/YOUR_USERNAME/clipforge.git
cd clipforge

# Install dependencies (only needed for the dev server)
npm install

# Start the local server with COOP/COEP headers
npm start
# → http://localhost:5173

Why a custom server? ffmpeg.wasm requires SharedArrayBuffer, which needs Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers. The included server.js sets these automatically. On GitHub Pages, coi-serviceworker.js handles this via a service worker.

---

🏗 Architecture

clipforge/
├── index.html          # Landing page with feature showcase
├── editor.html         # Tabbed editor with 15 tool panels
├── app.js              # Main application logic (all ffmpeg commands)
├── styles.css          # Full design system (dark theme, responsive)
├── server.js           # Local dev server with COOP/COEP headers
├── coi-serviceworker.js # Cross-origin isolation for GitHub Pages
├── serve.json          # Header config for static hosts
├── vendor/
│   ├── core/           # ffmpeg-core.js + ffmpeg-core.wasm
│   ├── ffmpeg/         # @ffmpeg/ffmpeg (FFmpeg class, worker)
│   └── util/           # @ffmpeg/util (fetchFile, toBlobURL)
└── .github/
    └── workflows/
        └── deploy.yml  # GitHub Pages deployment

Key design decisions:

• No build step — pure HTML/CSS/JS, instantly deployable
• Vendor files bundled — ffmpeg.wasm loaded from same origin (no CDN CORS issues)
• All processing client-side — zero server involvement after page load
• Service worker fallback — coi-serviceworker.js enables SharedArrayBuffer on hosts that don't support custom headers

---

🔒 Privacy

• ✅ No uploads — all video processing happens in your browser tab
• ✅ No tracking — no analytics, no cookies, no fingerprinting
• ✅ No accounts — no login, no sign-up, no personal data collected
• ✅ Works offline — after the first load, assets are cached by the service worker
• ✅ Open source — inspect every line of code yourself

---

🌐 Deployment

GitHub Pages (Recommended)

1. Push this repo to GitHub
2. Go to Settings → Pages
3. Under Source, select GitHub Actions
4. The included .github/workflows/deploy.yml handles deployment automatically on every push to main

Other Static Hosts

Deploy to Netlify, Vercel, Cloudflare Pages, or any static host. Make sure the host either:

• Sends Cross-Origin-Opener-Policy: same-origin and Cross-Origin-Embedder-Policy: require-corp headers (configure via serve.json or host-specific config), or
• Allows the coi-serviceworker.js to handle cross-origin isolation

---

🧰 Tech Stack

Layer	Technology
Video Processing	ffmpeg.wasm v0.12
Frontend	Vanilla HTML, CSS, JavaScript (ES Modules)
Typography	DM Sans + JetBrains Mono
Hosting	GitHub Pages
CI/CD	GitHub Actions

---

☕ Support

If ClipForge saved you time, consider buying me a coffee:

---

📄 License

This project is open source and available under the MIT License.

---

_{Built with ❤️ using ffmpeg.wasm — your videos never leave your device.}