Skip to content

Extract ​

Extract frames or thumbnails from video.

Quick example ​

typescript
import { ffmpeg } from "ffmpeg-kit";

const result = await ffmpeg.extract()
  .input("video.mp4")
  .timestamp(5)
  .size({ width: 640 })
  .format("jpg")
  .output("thumb.jpg")
  .execute();

console.log(result.outputPath); // "thumb.jpg"
console.log(result.width, result.height); // 640, 360

API ​

.input(path) ​

ParameterTypeDescription
pathstringPath to the input video file

.timestamp(t) ​

Time at which to extract the frame.

ParameterTypeDescription
tnumber | stringSeconds (5), timecode ("00:01:30"), or percentage ("50%")

.thumbnail() ​

Instead of a fixed timestamp, use FFmpeg's scene-change detection to find the most representative frame. Ignores .timestamp() if set.

.size(options) ​

ParameterTypeDefaultDescription
widthnumber—Output width in pixels
heightnumber—Output height in pixels

Omit one dimension to maintain aspect ratio. Omit both to use source dimensions.

.format(fmt) ​

ParameterTypeDefaultDescription
fmt"jpg" | "png" | "webp""jpg"Output image format

.quality(q) ​

JPEG/WebP quality.

ParameterTypeDefaultDescription
qnumber85Quality 1–100

.output(path) ​

Output file path. Required.

Examples ​

Extract frame at specific timestamp ​

typescript
await ffmpeg.extract()
  .input("video.mp4")
  .timestamp("00:01:30")
  .size({ width: 1280, height: 720 })
  .format("jpg")
  .quality(90)
  .output("frame.jpg")
  .execute();

Best representative thumbnail ​

typescript
await ffmpeg.extract()
  .input("video.mp4")
  .thumbnail()
  .size({ width: 640 })
  .format("webp")
  .output("thumb.webp")
  .execute();

Extract at percentage of duration ​

typescript
// Extract frame at 25% through the video
await ffmpeg.extract()
  .input("video.mp4")
  .timestamp("25%")
  .output("quarter.png")
  .execute();

Result type ​

typescript
interface ExtractResult {
  outputPath: string;
  width: number;
  height: number;
  size: number;        // file size in bytes
  probeResult: ProbeResult;
}