> ## Documentation Index
> Fetch the complete documentation index at: https://cloudinary.com/documentation/llms.txt
> Use this file to discover all available pages before exploring further.

# Convert videos to animated images (video tutorial)

## Overview

Learn how to convert videos to animated image formats, such as AVIF, WebP and GIF, on the fly by adding transformation parameters to the delivery URL.  

## Video tutorial

  This video is brought to you by Cloudinary's video player - embed your own!Use the controls to set the playback speed, navigate to chapters of interest and select subtitles in your preferred language.

## Tutorial contents
This tutorial presents the following topics. Click a timestamp to jump to that part of the video.
### Transform the video to a GIF
{table:class=tutorial-bullets}|  | 
| --- | --- |
|{videotime:id=media :min=0 :sec=05 :player=cld} | You can change a video to an animated image format using the [format](transformation_reference#f_format) parameter. For example, to transform an MP4 video to a GIF, specify `f_gif` in the URL.
|

### Reduce the file size
{table:class=tutorial-bullets}|  | 
| --- | --- |
|{videotime:id=media :min=0 :sec=24 :player=cld} | Images in the GIF file format are, in general, very large. You can reduce the file size by changing the dimensions to suit the displayed image size.  For example, [scale](resizing_and_cropping#scale) the image to a width of 600 pixels using `c_scale,w_600` (or, `w_600` as shown in the video). Additionally, to reduce the size further, reduce the [frames per second](transformation_reference#fps_fps) by adding, for example, `fps_6`, to use 6 frames per second. 
|

### Transform the video to a WebP
{table:class=tutorial-bullets}|  | 
| --- | --- |
|{videotime:id=media :min=1 :sec=03 :player=cld} | Another way to reduce the file size is by changing the format to one that's more optimal, for example WebP. You can do this by adding `f_webp,fl_animated,fl_awebp` to the URL, using the [animated](transformation_reference#fl_animated) and [awebp](transformation_reference#fl_awebp) flags.
|

### Use automatic format selection
{table:class=tutorial-bullets}|  | 
| --- | --- |
|{videotime:id=media :min=1 :sec=32 :player=cld} | You can let Cloudinary return the optimal format, based on what is supported by the requesting browser, by using [automatic format selection](image_optimization#automatic_format_selection_f_auto) (`f_auto:animated`).
|

### Loop the animated image
{table:class=tutorial-bullets}|  | 
| --- | --- |
|{videotime:id=media :min=2 :sec=06 :player=cld} | Make your animated image play infinitely by setting it to repeat continuously with the [loop effect](transformation_reference#e_loop) (`e_loop`).
|

## Keep learning

> **READING**:
>
> * Watch more [Dev Hints videos](https://www.youtube.com/playlist?list=PL8dVGjLA2oMpaTbvoKCaRNBMQzBUIv7N8) on the [Cloudinary YouTube channel](https://www.youtube.com/cloudinary).

> * Learn more about [converting videos to animated images](videos_to_animated_images), including the pros and cons of different animated image formats.

> * Discover what else you can do with [animated images](animated_images) and how to create them from still images.

#### If you like this, you might also like...

  
  
  
    Optimization Tips
    Tips for delivering optimized images 
  

  
  
  
    Zoompan Effect
    Apply the Ken Burns effect to zoom and pan on an image 
  

  
  
  
    Named Transformations
    Simplify & standardize complex delivery URLs 
  

 

 Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.