gem-hunter
主要言語: JavaScript
A browser-based video editor powered by ffmpeg.wasm. No uploads, no servers -- all processing happens locally in your browser using WebAssembly.
A browser-based video editor powered by ffmpeg.wasm. No uploads, no servers -- all processing happens locally in your browser using WebAssembly.
▶ Live app: https://tejaswigowda.com/ffmpeg-webCLI/
This tool is a reference implementation of the Web-CLI architecture, described in:
The Web-CLI: Verifiable Privacy for Tools, Models, and Inference Engines in the Browser Tejaswi Gowda, Arizona State University. arXiv: https://arxiv.org/abs/2608.28950
The paper defines the four properties (fidelity, progressive disclosure, offline-first, zero egress), presents four reference implementations, and argues that for sensitive data, client-side should be the default architecture - because it makes privacy a verifiable technical property rather than a policy promise.
✓ No Server Uploads : All video processing happens entirely on your device
✓ 30+ Video Operations : GIF creation, format conversion, compression, trimming, effects, filters, auto-captioning, and more
✓ Batch Processing : Process multiple videos at once with the same operation - or an entire operation chain - applied to every file; real-time progress, per-file preview, individual downloads, ZIP-all, and graceful fallback
✓ Offline-First PWA : Works completely offline after first use; install as a native app
✓ Screen Wake Lock : Screen stays active during video processing on any device
✓ Live Previews : See output size estimates and live settings adjustments
✓ Multi-Format Support : MP4, WebM, MKV, MOV, AVI, GIF, MP3, AAC, WAV, OGG, FLAC, JPG, PNG
✓ Advanced Features : Raw ffmpeg command access, subtitle embedding, concatenation, picture-in-picture, audio mixing
✓ Fast & Responsive : Uses Web Workers for background processing
✓ Privacy First : Zero data collection; works with your files locally
Cloud tools like CloudConvert, Kapwing, Ezgif, and Otter handle these same tasks. Every one of them uploads your file to a server. Some are free with ads, some charge, but all of them see your file, and all are subject to data breaches, subpoenas, and shifting privacy policies.
ffmpeg-webCLI does format conversion, trimming, compression, GIF creation, audio extraction, captioning, and more all in your browser, for free. Reach for it when your files are private, when you can't install software, or when you'd simply rather not upload. Your video never leaves your device.
Convert any video clip into an animated GIF. Set the frame rate and output width; height scales automatically to preserve the aspect ratio. Uses a two-pass palette generation for the best possible color quality.
Re-encode a video to a different container and codec:
Reduce file size without changing the resolution. Dial in the quality with a CRF slider (18 = near-lossless → 51 = maximum compression) and pick an encoding preset (ultrafast → veryslow) to trade encoding speed for compression efficiency. A live size estimate updates as you adjust the settings.
Set a start and end point with the timeline sliders before running any operation. Trimming is applied on top of every other operation, so you can, for example, extract a short clip, compress it, and convert it to GIF all at once.
Change the output dimensions and compress in one pass. Width and height are auto-filled from the source video; edit either value or leave it blank to let ffmpeg maintain the aspect ratio. Combines a scale filter with CRF-based H.264 encoding.
Pull the audio track out of any video into a standalone audio file:
Strip the audio stream entirely. Output is the original video with no audio track -- useful for silent loops, social media clips, or before replacing the audio elsewhere.
Speed up or slow down playback (0.25× – 4×). Both the video PTS and the atempo audio filter chain are adjusted so audio pitch and sync are preserved. Chains multiple atempo stages automatically when the multiplier is outside the 0.5–2.0 range that a single filter accepts.
Correct orientation or create mirror effects without re-uploading. Options: 90° clockwise, 90° counter-clockwise, 180°, flip horizontal, flip vertical, or flip both axes.
Trim the frame to a specific region. X/Y offset and width/height are auto-filled from the source video dimensions so you can immediately drag values down rather than starting from scratch.
Pull a single frame from any point in the video and save it as a JPEG or PNG image. The timestamp field is pre-filled to the midpoint of the loaded clip.
The frame is always extracted as a PNG (ffmpeg's -frames:v 1); JPEG output is then produced in-browser via a canvas. This works around a crash (memory access out of bounds) in the WebAssembly core's MJPEG encoder, so JPEG thumbnails stay reliable across all clips, including high-frame-rate and variable-frame-rate sources.
Play the video (and audio) backwards using ffmpeg's reverse + areverse filters. The reverse filter buffers the entire video into memory for processing, which combined with re-encoding makes it memory-intensive. Works in single mode; not supported in batch mode to prevent memory exhaustion when processing multiple large files (risk of hitting the 2GB WebAssembly heap limit).
Add a smooth fade-in, fade-out, or both. Set the duration in seconds for each direction independently; the filter is applied after any trim.
Fine-tune the look of a clip with the eq filter. Three sliders control brightness (−1 → 1), contrast (0 → 2), and saturation (0 → 3). A Grayscale checkbox pins saturation to zero for instant black-and-white output.
Remove all embedded metadata -- GPS coordinates, camera make/model, creation timestamps, and any other tags -- before sharing a file. Uses -map_metadata -1 during re-encoding.
Mux an .srt, .vtt, or .ass subtitle file into the video. Two methods:
mov_text.srt, .vtt, and .ass/.ssa.Caption font size (hard-burn only): choose Small, Medium (default), or Large. The size scales with the video resolution so captions stay proportional on any clip.
Generate automatic captions from speech using OpenAI's Whisper model via Transformers.js. Transcription runs entirely in your browser. Your audio never leaves your device. Model weights are cached locally in IndexedDB after the first download, and the library is cached by the service worker for offline use. Edit the transcript before embedding it as a soft subtitle track or burning it into the frames.
Workflow:
Model Selection (choose speed vs. accuracy):
Models are lazy-loaded and cached on first use (~15–30 seconds for initial download, then instant on subsequent runs).
Output Format (soft-subtitle embedding):
mov_textWith Hard-burn checked, the captions are instead baked into the video frames using the same browser-canvas renderer as Embed Subtitles (word-wrapped, centered, bottom-anchored, with a Small / Medium / Large font-size choice).
Key Features:
Boost or reduce the audio level of any video. A single slider sets the volume multiplier (0 = silence, 1.0 = unchanged, up to 4×). Audio is re-encoded using the volume filter; the video stream is stream-copied (no quality loss, no re-encode overhead).
Play the video N times back-to-back in a single output file. Set Total plays (2–50); ffmpeg uses -stream_loop with stream copy so there is no re-encoding and the output file is proportionally larger. Trim is not applied for this operation. Supported in batch mode - each video loops independently with minimal memory overhead, making it safe and efficient for batch processing repeated content.
Stamp a logo, watermark, or any image (PNG with transparency works best) onto every frame. Controls:
Uses the overlay filter with a scale pre-pass. Video is re-encoded; audio is stream-copied.
Blend a second audio file into the video as background music. Controls:
The music track loops automatically via -stream_loop -1 if it is shorter than the video. Both streams are mixed with the amix filter (duration=first so output matches the video length). Video is stream-copied.
Append a second video clip after the loaded file. Uses the concat filter with H.264/AAC re-encoding, so clips with different resolutions, frame rates, and codecs are handled automatically. Trim applies to the first clip only; the second clip is taken in full.
Place two video clips next to each other in a single frame:
hstack) or Vertical (top / bottom using vstack)Re-encodes to H.264/AAC. Useful for comparison videos, reaction videos, and split-screen content. Trim is ignored.
Overlay a second video on top of the main clip in a small inset window. Controls:
The overlay video loops automatically if it is shorter than the main clip. Trim applies to the main clip. Audio from the main clip is preserved. Both streams are re-encoded to H.264/AAC.
Displays key metadata extracted from the browser's video element immediately when a file is loaded:
Click Process Video to run a deep scan (ffmpeg -hide_banner -i …) and print full codec, stream, pixel format, and container details to the log panel below.
Full access to the ffmpeg command line directly in the browser. Type any arguments into the text area; they are inserted after -i input and before the output filename. Choose the output file extension and optionally bypass the trim range. A live full command preview updates as you type, showing the exact command that will be executed. Quoted values containing spaces are handled correctly.
An Example Commands library (collapsible) provides one-click recipes to get started:
| Example | What it does |
|---|---|
| ▢ Color-bar watermark | Semi-transparent drawbox stamp in the bottom-right corner |
| ▶ Cap framerate to 24 fps | fps=24 filter + H.264 re-encode |
| ◎ Convert to grayscale | format=gray + H.264 re-encode |
| ◆ Loudness normalize | loudnorm filter, stream-copies video |
| ◇ Lossless remux (copy) | -c copy - change container, zero quality loss |
| ⊞ Letterbox / pillarbox | Scales to 1920×1080, pads with black bars |
| ≈ Denoise (hqdn3d) | Temporal + spatial denoising |
| ◉ Sharpen (unsharp) | unsharp mask filter |
| ⊗ Stabilize (deshake) | deshake motion stabilization |
| ⊕ Vignette effect | vignette filter darkens edges |
| ⊘ Extract audio as WAV | -vn -acodec pcm_s16le lossless audio export |
| ▭ Extract first frame | -vframes 1 saves a single PNG |
| ♪ Replace audio track | Strips original audio and muxes in input2.mp3; uses -map 0:v:0 -map 1:a:0 -shortest |
Clicking a recipe fills in the arguments and extension fields instantly.
Second input file : the Raw FFmpeg panel includes an optional Choose file picker. The selected file is written to ffmpeg's virtual filesystem as
input2.<ext>and can be referenced in your arguments (e.g.-i input2.mp3). Required by the Replace audio track recipe.
Add colored bars to bring a video to a specific aspect ratio without cropping or stretching it. The video is scaled down to fit entirely inside the target canvas; empty space is filled with the chosen pad color.
| Target Ratio | Typical use |
|---|---|
| 16:9 | YouTube, TV, most monitors |
| 9:16 | Instagram / TikTok Reels, Stories |
| 1:1 | Instagram square feed |
| 4:3 | Classic TV / legacy formats |
| 4:5 | Instagram portrait feed |
| 21:9 | Cinematic / ultrawide |
Pad colors: Black, White, Gray. Re-encodes to H.264/AAC.
Bring the perceived loudness of a clip to a broadcast-standard target using ffmpeg's loudnorm (EBU R128) filter. Choose a target integrated loudness level:
The video stream is stream-copied (no re-encode); only the audio is processed.
Reduce video noise with the hqdn3d (high-quality 3D denoise) filter, which combines spatial and temporal noise reduction. Three presets:
| Strength | Parameters | Best for |
|---|---|---|
| Light | 2:2:3:3 |
Mild grain, HDR content |
| Medium | 4:4:6:6 |
Standard noise removal |
| Heavy | 10:10:15:15 |
Heavy noise / low-light footage |
Re-encodes video with H.264; audio is stream-copied.
Creates the classic boomerang loop effect: the clip plays forward then immediately in reverse in a single output file. Uses ffmpeg's reverse filter concatenated with the original via the concat filter. Trim is respected for the forward segment. Audio is removed (the reverse of audio rarely sounds intentional).
Apply a sharpening or blur effect to the entire video.
unsharp mask filter (luma + chroma):
unsharp=3:3:0.8:3:3:0unsharp=5:5:1.5:5:5:0unsharp=7:7:3:7:7:0boxblur filter:
boxblur=3:1boxblur=6:1boxblur=12:1Video is re-encoded to H.264; audio is stream-copied.
Stack several compatible operations and run them in a single pass. Switch the Operations panel to Stack (chain) mode, configure an op, and click Add to Stack to queue it. The queue is an ordered, reorderable list - move items up/down or remove them - and a live composed command preview shows the exact ffmpeg invocation before you run it.
All stacked operations are merged into one filter chain (-vf "a,b,c" / -af "x,y") and encoded only once, so quality loss from repeated re-encoding is avoided. Any active trim is applied first as input seeking, then the chain runs, then the single encode targets your chosen output format. For example, crop → grayscale → convert-to-MP4 becomes:
ffmpeg -i input.mp4 -vf "crop=1280:720:0:0,eq=brightness=0:contrast=1:saturation=0" -c:v libx264 -preset fast -c:a aac output.mp4
Chainable: Crop, Resize, Rotate/Flip, Adjust (brightness/contrast/saturation), Grayscale, Fade, Denoise, Sharpen/Blur, Speed, Pad/Letterbox and Volume - every single-input, frame-wise video/audio filter.
Not chainable (use Single mode): multi-input operations (Concatenate, Side by Side, Picture in Picture, Mix Audio, Embed Subtitles, Logo Overlay) and whole-file or different-output operations (GIF, Thumbnail, Boomerang, Media Info). These are disabled in Stack mode with an inline explanation.
Chaining + batch together: Stack mode and batch mode combine - enable Batch, queue several files, switch to Stack (chain), build your chain once, and click Process Stack to apply the entire chain to every queued file. Each file is composed against its own dimensions/duration (so crop, pad, and fade resolve per file) and encoded in a single pass, with results shown in the batch outputs panel.
Process multiple video files with the same operation in a single session. Click the Batch toggle in the Input Video card to enable batch mode, then drop or select multiple files. Each file is queued with a status indicator:
When you click Process Queue, ffmpeg runs through each file sequentially. The log shows real-time progress: [X/total] Processing: filename. Completed files appear in the Batch Outputs panel of the Output section, where you can pick any file to preview it in the player, download files individually, or grab everything at once with ZIP All - no need to wait for the entire batch to finish before downloading completed files.
Batch + Stack (chaining): Batch isn't limited to a single operation. Switch the Operations panel to Stack (chain) while batch mode is on, build a chain, and Process Stack applies the whole chain to every queued file in one pass each. See Operation Chaining above.
Graceful Fallback: If you have a video already loaded and enable batch mode, the app automatically adds it to the queue so you don't lose your work.
Supported Operations in Batch Mode (25 total):
Unsupported in Batch Mode (operations require per-file configuration, multi-input coordination, or cause memory constraints):
These operations are visually greyed out in batch mode to prevent accidental selection.
This project is maintained with community feedback. Key features and improvements from user requests and contributions:
Local Processing:
All file I/O stays on your machine. Nothing is sent to any server.
Performance & Reliability:
The editor works completely offline with intelligent caching and screen wake lock support:
git clone https://github.com/tejaswigowda/ffmpeg-webCLI cd ffmpeg-webCLI node server.js # serves docs/ at http://127.0.0.1:5500 (or: node server.js 8080)
The single-thread core in use (@ffmpeg/core@0.12.10) does not need SharedArrayBuffer, so the server sends no cross-origin isolation headers. FFMPEG_ISOLATION=1 node server.js sends Cross-Origin-Opener-Policy: same-origin and Cross-Origin-Embedder-Policy: require-corp for experiments with a multi-thread core; note that COOP cuts the popup's link to its opener, so the hand-off below cannot work with it on.
Or serve the docs/ folder with any static server:
# Alternative: using npx serve
npx serve docsBesides the #cmd= recipes, a page that opens this tool in a popup can send it files and get one back, with no upload (docs/handoff.js, tested by test/handoff.test.mjs). The op is mux: a video, plus a narration WAV and/or WebVTT captions, in; one MP4 out, with the video copied (not re-encoded), the audio encoded to AAC and the captions as a soft mov_text track. Strata uses it to make a single-file MP4 next to a published HLS render. Only the window that opened this one, at https://strataeditor.dev or localhost, is answered.
opener -> ffmpeg { webcli: 1, type: 'job', id, op: 'mux', args: { language?: 'eng', audio_kbps?: 128 }, files: { 'video.mp4', 'audio.wav'?, 'captions.vtt'? } }
ffmpeg -> opener { webcli: 1, type: 'progress' | 'result' | 'error', id, ... } result.files['out.mp4'], result.meta.command
Details of the contract:
language must match ^[a-z]{3}$, otherwise eng is used; audio_kbps must be an integer from 32 to 320, otherwise 128.-shortest); a shorter narration just ends early. video.mp4 may be a plain MP4 or an fMP4 init.mp4 + seg*.m4s joined into one file.error at once. ffmpeg.wasm keeps the input, the output and the +faststart second pass in its in-browser memory. Measured in Chromium (node test/measure-large.mjs): a 1080p60, 100 s video of 43 MB with its 18 MB narration took 3.5 s and peaked at about 1.1 to 1.6 GB resident for the whole browser; 97 MB in total peaked near 2.3 GB.cancel message terminates ffmpeg.wasm (the job is answered with error: Cancelled.) and the core is loaded again for the next job; closing the popup also works.error with a message): missing or empty files, an unknown op, over the size limit, ffmpeg exiting non-zero (the last log lines are in the message), the core failing to load or taking over two minutes, a window that is busy with its own work. The virtual files are deleted after every job, successful or not.ALLOWED_ORIGINS (docs/handoff.js), is answered; the same file is used by dub-webCLI.Try it locally: node server.js, then open an opener page from localhost or 127.0.0.1 (any port). Do not serve with Cross-Origin-Opener-Policy: same-origin: the popup loses window.opener and can never answer. Tests: node --test test/handoff.test.mjs (the protocol, no browser) and npm install && npm run test:e2e (real Chromium and ffmpeg.wasm; needs the native ffmpeg/ffprobe for fixtures and checks).
A family of zero-egress browser tools - your data never leaves your device, verifiable in DevTools. All free, open source, and installable as offline PWAs.
Architecture paper: arXiv:2608.28950
This project is licensed under the GNU General Public License v3.0 (GPL-3.0). See LICENSE for details.
You are free to: ✓ Use this software for any purpose
✓ Study and modify the source code
✓ Distribute copies of the software
✓ Distribute modified versions
With the requirement that you:
▢ Include a copy of the license
✎ Document changes made to the code
◆ Make source code available when distributing
This project builds on ffmpeg.wasm (LGPL-2.1) which is built from FFmpeg (LGPL-2.1+).