@capgo/capacitor-video-thumbnails

Generate video thumbnails from local or remote video files.

Why Capacitor Video Thumbnails?

Extract thumbnail images from videos at specific time positions:

- Local & Remote Videos - Works with both file:// paths and http(s):// URLs
- Custom Time Position - Extract frame at any millisecond timestamp
- Quality Control - Adjustable JPEG compression quality
- HTTP Headers Support - Custom headers for authenticated video sources
- Cross-platform - Consistent API across iOS, Android, and Web

Perfect for video galleries, media players, video editors, and any app that needs video preview images.

Documentation

The most complete doc is available here: https://capgo.app/docs/plugins/video-thumbnails/

Compatibility

| Plugin version | Capacitor compatibility | Maintained |
| -------------- | ----------------------- | ---------- |
| v8.\.\ | v8.\.\ | ✅ |
| v7.\.\ | v7.\.\ | On demand |
| v6.\.\ | v6.\.\ | ❌ |
| v5.\.\ | v5.\.\ | ❌ |

> Note: The major version of this plugin follows the major version of Capacitor. Use the version that matches your Capacitor installation (e.g., plugin v8 for Capacitor 8). Only the latest major version is actively maintained.

Install

``bash
npm install @capgo/capacitor-video-thumbnails
npx cap sync
`

Requirements

- iOS: iOS 15.0+
- Android: API 24+ (Android 7.0+)
- Web: Modern browsers with HTML5 video support

API

* getThumbnail(...)
* getPluginVersion()
* Interfaces
* Type Aliases

Capacitor Video Thumbnails Plugin interface for generating video thumbnails.

$3

`typescript
getThumbnail(options: VideoThumbnailsOptions) => Promise
`

Generate a thumbnail image from a video file at a specific time position.

| Param | Type | Description |
| ------------- | ------------------------------------------------------------------------- | -------------------------------------- |
| options | VideoThumbnailsOptions | - Options for generating the thumbnail |

Returns: Promise<VideoThumbnailsResult>

Since: 8.0.0

--------------------

$3

`typescript
getPluginVersion() => Promise<{ version: string; }>
`

Get the native Capacitor plugin version.

Returns: Promise<{ version: string; }>

Since: 8.0.0

--------------------

$3


#### VideoThumbnailsResult

Result of thumbnail generation.

| Prop | Type | Description |
| ------------ | ------------------- | --------------------------------------------------------------------------------------------------------------- |
| uri | string | The local URI path to the generated thumbnail image. This can be used directly in img tags or Image components. |
| width | number | Width of the generated thumbnail in pixels. |
| height | number | Height of the generated thumbnail in pixels. |


#### VideoThumbnailsOptions

Options for generating a video thumbnail.

| Prop | Type | Description |
| --------------- | --------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| sourceUri | string | The URI of the video file. Can be a local file path or a remote URL. For local files, use file:// protocol or absolute path. For remote files, use http:// or https:// protocol. |
| time | number | The time position in milliseconds from which to extract the thumbnail. Defaults to 0 (first frame). |
| quality | number | Quality of the generated image, from 0.0 (lowest) to 1.0 (highest). Defaults to 1.0. |
| headers` | Record<string, string> | HTTP headers to include when fetching remote video URIs. Only applicable for remote URLs. |

$3

#### Record

Construct a type with a set of properties K of type T

{ [P in K]: T; }

Credits

This was inspired from (Expo SDK)[https://docs.expo.dev/versions/latest/sdk/video-thumbnails/]