How to Convert a Video to GIF using Node.js?

There are several reasons why you would want to create a GIF from a video, such as to generate a short GIF based on a small segment of an MP4. To create an animated GIF with Node.js, you will need an API that supports the file format. Here's how to generate GIFs with just a few lines of JavaScript:

Input Code

const Creatomate = require('creatomate');
const client = new Creatomate.Client('Your API Key');

client.render({
  source: new Creatomate.Source({
    outputFormat: 'gif',
    gifQuality: 'best',
    gifCompression: 100,
    frameRate: 10,
    duration: 3,
    elements: [
      new Creatomate.Video({
        source: 'https://cdn.creatomate.com/demo/bird.mp4',
      }),
    ],
  }),
}).then((renders) => {
  console.log(renders);
});

Copy to clipboard 📋

Output GIF

How it works: Start by installing the Creatomate library from NPM. This library provides a feature-rich API for GIF-related tasks. You can now use Node.js code to define a GIF composition containing a single video element.

Make sure "output_format" is set to "gif". If you want to output another file type, you can set this to "jpg", "png", or "mp4". In case you want to export a GIF, you can use the "gif_quality" and "gif_compression" options. The "gif_quality" option lets you choose between "best" and "fast", depending on whether you care about quality over conversion speed. The "gif_compression" is a number from 0 to 200, which can further compress a GIF's file size, but at the cost of output artifacts.

Additionally, set a "frame_rate" (in this case, 10 frames per second), the GIF duration (3 seconds), and optionally "width" and "height". Together, these options give you lots of control over the final GIF.

If you want to put a logo or caption over your GIF, you can do that too. Check out the examples below to learn how, and make sure to try out the video editor. The online tool allows you to design your own GIF overlays, then export the code for use in Node.js.