> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://fastpix.com/docs/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://fastpix.com/docs/_mcp/server.

# Create GIFs from a video

FastPix converts any on-demand video into an animated GIF or WebP preview that boosts click-through rates and social engagement by adding motion to thumbnails, product pages, and feeds. GIFs are highly popular for adding visual dynamism and are particularly effective in social media, messaging, and content-sharing platforms. This guide walks through the step-by-step process of generating GIFs with FastPix, from video initialization to final output customization.

## Prerequisites

* A FastPix account with an active workspace ([Activate your account](/getting-started/activate-your-account))
* Your **Access Token ID** and **Secret Key** from the FastPix dashboard
* An uploaded on-demand video with status `ready` and a `playbackId`

### Key terms

* `mediaId` is the unique identifier FastPix assigns to every uploaded asset.
* `playbackId` is a separate, access-controlled identifier used to construct playback and image URLs. FastPix keeps them separate so you can control playback access independently from asset management.

\


## Create an on-demand video

Create the source asset that the GIF will be extracted from. You can upload [directly from your device](/upload-videos/upload-videos-from-device) or [add the video using a URL](/upload-videos/upload-videos-from-a-url). For a walk-through of the full flow, see the [quick start guide](/get-started/quickstart).

\


## Monitor the video status

Wait for the media `status` to change to `ready` before requesting a GIF. Until transcoding completes, the `playbackId` is not yet bound to renditions that the image service can sample from.

\


## Extract a GIF

Send a `GET` request to the image endpoint with the target `playbackId` and the segment you want to convert. The endpoint returns an animated GIF or WebP directly — no polling or webhook is required.

**URL format**

```text
https://images.fastpix.com/{PLAYBACK_ID}/clip.{gif|webp}
```

**Supported formats**: `gif` or `webp`. WebP produces smaller files at comparable visual quality and is the better choice for mobile and high-traffic pages. Use `gif` when the destination platform does not render animated WebP (for example, older email clients).

> **NOTE:** \
> To generate an animated preview for a video with `accessPolicy: private`, sign the URL with a JWT. See [Secure playback with JWTs](/video-security/generate-jwts-for-secure-media).

\


### Request details

* **Method**: `GET`
* **Endpoint**: `https://images.fastpix.com/{PLAYBACK_ID}/clip.{gif|webp}`
* **Auth**: HTTP Basic: Access Token ID as username, Secret Key as password

**Path parameters**

| Parameter           | Type   | Required | Description                            |
| :------------------ | :----- | :------- | :------------------------------------- |
| `PLAYBACK_ID`       | UUID   | Yes      | The `playbackId` of the source video.  |
| `ServiceWithFormat` | String | Yes      | Output format. Either `gif` or `webp`. |

**Query parameters**

| Parameter | Type  | Required | Description                                                                                                      |
| :-------- | :---- | :------- | :--------------------------------------------------------------------------------------------------------------- |
| `start`   | Float | No       | Start time in seconds on the video timeline. Defaults to `0`.                                                    |
| `end`     | Float | No       | End time in seconds. Defaults to 5 seconds after `start`. Maximum duration is 10 seconds.                        |
| `height`  | int32 | No       | Height in pixels. Defaults to an aspect-ratio-preserving value from `width`. Maximum `640`.                      |
| `width`   | int32 | No       | Width in pixels. Defaults to `320`. Maximum `640`. If `height` is set, `width` adjusts to preserve aspect ratio. |
| `fps`     | int32 | No       | Frame rate. Defaults to `15`. Maximum `30`.                                                                      |

\


### Example request

```bash
curl --request GET \
  --url 'https://images.fastpix.com/def4bf9f-6571-4edb-bb5c-ce3bfb60bd95/clip.gif?width=320&height=200&start=0&end=5&fps=15' \
  --user 'your-access-token-id:your-secret-key' \
  --output preview.gif
```

**Example URL**

```text
https://images.fastpix.com/def4bf9f-6571-4edb-bb5c-ce3bfb60bd95/clip.gif?width=320&height=200&start=0&end=5&fps=15
```

![Animated GIF output generated from a FastPix on-demand video](https://files.readme.io/5b0c8baac4d19882131b28b2239d88c01cf758127dc7a1f9ac3a7825c4e998de-image.png)

**Signed URL for private playback**

```text
https://images.fastpix.com/5f7d0954-b546-45e6-a38a-9c68bfc57e43/clip.gif?token={JWT}&width=320&height=200&start=0&end=5&fps=15
```

\


## Common use cases for animated previews

* **Tutorials and walk-throughs**: A silent GIF demonstrates a feature: logging in, running a search, opening a setting, without the bandwidth cost of embedding a video.

* **Highlight key moments**: Extract a 5-second segment from a longer recording (a goal, a product reveal, a demo beat) and surface it on a landing page or in search results.

* **Social sharing and messaging**: When choosing dimensions for your GIF, select sizes that fit within your application’s design and user experience requirements. Consistent sizing keeps your UI looking cohesive and prevents layout shifts. Also, smaller resolutions improve load time, especially important for mobile devices.

* **Product demos in e-commerce**: Show a product rotating, a feature animating, or a UI step in motion on a category page where a full video player would be heavyweight.

\


## Best practices for GIF and WebP output

1. **Keep duration between 3 and 5 seconds**: The maximum supported is 10 seconds, but shorter clips loop more smoothly and load faster on mobile. This is especially useful in social and e-commerce apps, where users expect quick content previews.

2. **Optimize the frame rate to the motion**: The frame rate (fps) determines the GIF’s smoothness. Use `fps=15` to `fps=20` for hands-on UI demos or fast motion. Drop to `fps=10` for subtle motion to cut file size without visible loss.

3. **Cap dimensions at the display size**: Requesting a `640x360` GIF that renders at `320x180` wastes bandwidth. The width default of `320` is a good starting point.

4. **Prefer WebP where supported**: Animated WebP is typically 25–50% smaller than a comparable GIF at the same quality, which matters on mobile and high-traffic pages.

\


#### Frequently asked questions

Use `webp` for modern browsers and mobile apps, it produces smaller files at comparable quality. Use `gif` when the destination (older email clients, some embed contexts) does not render animated WebP.

The `end - start` window can be up to 10 seconds. If you omit `end`, FastPix defaults to 5 seconds after `start`.

Yes. The image endpoint accepts HTTP Basic auth with your Access Token ID and Secret Key. For videos with `accessPolicy: private`, you additionally need a signed JWT appended as a `token` query parameter.

Indirectly reduce `fps`, shrink `width` and `height`, or shorten the `end - start` window. Switching `gif` to `webp` usually produces the largest single size reduction.

\


## What's next?

* [Extract thumbnails and images from a video](/video-on-demand/create-thumbnails-from-a-video)
* [Create clips from existing media](/video-on-demand/clip-and-trim-videos)
* [Secure playback with JWTs](/video-security/generate-jwts-for-secure-media)
* [API Reference: image and clip endpoints](/video-on-demand-api/overview)