A Next.js web application for extracting high-quality frames from videos. All video processing is done entirely client-side, ensuring privacy and speed.
- Drag & Drop Upload: Easily upload videos by dragging them into the interface.
- Precision Control: Navigate through videos frame-by-frame using keyboard arrows.
- Advanced Playback: Control playback speed (0.25x - 2x) and toggle audio mute.
- Video Adjustments: Rotate (90° steps), Flip (H/V), and interactive Crop (drag/resize) before capturing.
- WYSIWYG Capture: Captured frames exactly match your video adjustments (Crop/Rotate/Flip).
- Video Metadata: View detailed video info (Resolution, Codec, Duration, Size).
- Batch Review Mode: Manage captured frames with Split-Screen Comparison and Carousel view.
- Comparison View: Smart auto-loading split view for side-by-side image inspection.
- Export Options: Save single frames as PNG/JPG/WEBP, or batch download all frames with format selection.
- Visual Timeline: Filmstrip of thumbnails for quick visual navigation with Zoom-on-Hover.
- Full Offline Support: Install as PWA and use even when the server is down.
- Client-Side Processing: No server interactions; everything happens in your browser.
- Responsive Design: Full-width layout that automatically fits video and images to your browser window.
- Node.js (v20 or newer recommended)
- npm, yarn, pnpm, or bun
-
Clone the repository:
git clone <repository-url> cd VideoImageGrabber
-
Install dependencies:
npm install
-
Run the development server:
npm run dev
The application will start on http://localhost:3000.
For offline PWA support, run the production build:
npm run build
node .next/standalone/server.jsDeploy with Docker Compose:
docker-compose up -d --buildThe service will be available at port 3051 (mapped to internal port 3000).
- Next.js - The React Framework
- Lucide React - Icons
This project is open source and available under the MIT License.