A curated list of awesome GIF resources
Contents
·
Use
·
Authors
·
License & Credits
This is a list of tools, scripts, libraries, examples & other resources related to the Graphics Interchange Format (GIF) image format.
Contents
General Tools
Utilities
- Gifgen - Simple high quality GIF encoding
- Gifify - Convert any video file to an optimized animated GIF
- Gifify (not the same) - convert screen recording into GIF
- Gifsicle - lossy GIF compressor
- Gifs - storage place for GIFs - demo
- Gifshot - create animated GIFs from media by Yahoo - demo
- Gifsockets - Real Time communication library using Animated GIFs as a transport
- X-gif - a web component for flexible GIF playback
- gifme - generate animated GIFs
- GifW00t - javascript web recorder
- gif-machine - GIF creation from Youtube videos
- gifstreaming - Live video streaming server
- Screengif - Create animated GIF screencasts
- vnc-over-gif - Serves screen updates as animated GIF over http
- gifdeck - Convert your SlideShares into animated GIFs
- Gifbot - GIF search for Slack
- Gif-camera - create animated GIFs using webcam
- Gifline - Chrome extension to put GIFs in your emails
- Gifdrop - Create a repository for your collection of gif images
- Gh-gif - NodeGH plugin for commenting on pull requests/issues using GIF reactions
- Tty2gif - record scripts and their outputs into both binary and GIF formats
- Giftoppr - Sync your favourite GIFs with Dropbox
- Gifit - Chrome extension to make a GIF from a YouTube video
- Ccapture.js - Capture animations created with HTML5 canvas
- Kap - Beautiful open-source app to capture your screen and export to GIF.
- Gifit (the other one) - Get a search resulting giphy GIF in markdown in stdout, ala
$ gifit kittens.
Libraries
ActionScript
C++
- Node-gif - C++ library to make GIF
- Gif-h - C++ one-header library for the creation of animated GIFs
- OfxGifEncoder - C++ openframeworks addon to export animated GIFs
C#
- [dot-screencap](https://github.com/Speiser/dot-screencap) - A simple libary to record your screen and save it as animated GIF
- [WpfAnimatedGif](https://github.com/thomaslevesque/WpfAnimatedGif) - A simple library to display animated GIF images in WPF
- [XamlAnimatedGif](https://github.com/thomaslevesque/XamlAnimatedGif) - A simple library to display animated GIF images in XAML apps (WPF, WinRT, Windows Phone)
#### Haxe
- [Gif](https://github.com/snowkit/gif) - Haxe GIF encoder
#### Java
- [Android-gif-drawable](https://github.com/koral--/android-gif-drawable) - Views and Drawable for displaying animated GIFs on Android
- [gifanimateddrawable](https://github.com/Hipmob/gifanimateddrawable) - Use an animated GIF as an Android Drawable
- [GifView](https://github.com/RoiSoleil/GifView) - android library to deal with GIF
- [Gif Movie View](https://github.com/sbakhtiarov/gif-movie-view) - Android View widget for displaying GIF animations
- [GifImageView](https://github.com/felipecsl/GifImageView) - Android ImageView that handles animated GIF images
- [Gif-animation](https://github.com/extrapixel/gif-animation) - Processing library to play and export GIF
- [Android-gif-encoder](https://github.com/nbadal/android-gif-encoder) - animated GIF encoder for Android
- [GIFDroid](https://github.com/quackware/GIFDroid) - Android video to GIF converter
- [Android-GifStitch](https://github.com/CaptPhunkosis/Android-GifStitch) - create and share animated GIFs
#### JavaScript
- [Gif.js](https://github.com/jnordberg/gif.js) - Javascript - create GIF from the DOM
- [Omggif](https://github.com/deanm/omggif) - Javascript - GIF 89a encoder and decoder
- [Animated_GIF](https://github.com/sole/Animated_GIF) - Javascript library for creating animated GIFs
- [Gifffer](https://github.com/krasimir/gifffer) JavaScript library that prevents the autoplaying of the animated GIFs
- [Gifplayer](https://github.com/rubentd/gifplayer) - jquery plugin to play and stop animated GIFs
- [Jsgif](https://github.com/shachaf/jsgif) - JavaScript GIF parser and player
- [node-gify](https://github.com/tj/node-gify) - Javascript convert videos to GIFs using ffmpeg and gifsicle
- [Gifencoder](https://github.com/eugeneware/gifencoder) - Server side animated GIF generation for node.js
- [Gif-video](https://github.com/hughsk/gif-video) - Javascript Convert a GIF image into an HTML5-ready video
- [Gif-player](https://github.com/apankrat/gif-player) - On-demand GIF loader/player in Javascript
- [GifgifLab-face](https://github.com/Viral-MediaLab/gifgifLab-face) - Facial-emotion detectors
- [node-youtube](https://github.com/javascipt/node-youtube) - Youtube to snapshots and GIFs.
#### PHP
- [GifCreator](https://github.com/Sybio/GifCreator) - PHP class that creates animated GIF from multiple images
- [Spacer.gif](https://github.com/msng/spacer.gif) - PHP script offering spacer.gif 1x1
- [GifFrameExtractor](https://github.com/Sybio/GifFrameExtractor) - PHP class that separates all the frames of an animated GIF
#### Objective-C
- [AnimatedGIFImageSerialization](https://github.com/mattt/AnimatedGIFImageSerialization) - decodes an UIImage from Animated GIFs image data
- [UIimage from GIF](https://github.com/mayoff/uiimage-from-animated-gif) - UIImage category that loads animated GIFs
- [GIFRefreshControl](https://github.com/cyndibaby905/GIFRefreshControl) - "Twitter music" and "Yahoo! Weather" like pull-to-refresh control
- [UIImageView-PlayGIF](https://github.com/yfme/UIImageView-PlayGIF) - UIImageView category/subclass for playing GIF
- [FLAnimatedImage](https://github.com/Flipboard/FLAnimatedImage) - Gif engine for iOS by FlipBoard
- [Animated-GIF-iPhone](https://github.com/arturogutierrez/Animated-GIF-iPhone) - Support for Animated GIF on iOS
- [UzysAnimatedGifPullToRefresh](https://github.com/uzysjung/UzysAnimatedGifPullToRefresh) - PullToRefresh using animated GIF to any scrollView
- [SvGifView](https://github.com/smileEvday/SvGifView) - iOS load and display GIF
- [GifHUD](https://github.com/cemolcay/GiFHUD) - iOS progress hud for displaying only animated GIF images
- [Video-Background GIF](https://github.com/ElvinJin/Video-Background-GIF) - iOS Video Background GIF
- [AnimatedGifExample](https://github.com/kasatani/AnimatedGifExample) - iOS animated and transparent GIFs
- [OLImageView](https://github.com/dtorres/OLImageView) - iOS OLImage and OLImageView support for animated GIFs
#### Swift
- [Gifu](https://github.com/kaishin/gifu) - animated GIF support for iOS in Swift
- [SwiftGif](https://github.com/bahlo/SwiftGif) - UIImage extension with GIF support
### GUI
- [Glyph](http://www.glyph.video/) - tool for generating seamlessly looping GIFs and cinemagraphs from videos
- [Qgifer](https://sourceforge.net/projects/qgifer/)
- [GIFs](https://github.com/orta/GIFs) - Mac App for finding GIFs
- [VineGifR](https://github.com/esten/VineGifR) - Mac app to turn Vine videos into GIFs
- [GifPro](https://github.com/unixpickle/GifPro) - GIF encoder for Mac
- [Gif Maker](https://movielala.com/gif-maker/) - High quailty GIF maker with filters for Mac
### Hosting
- [Gfycat](https://gfycat.com) - Maximum GIF/video length: 15 seconds. Maximum file upload is 300Mb
- [Imgur](https://imgur.com) - Maximum file upload is 50MB
### Online Tools
- [Vid2gif](http://imgur.com/vidgif) - Video to GIF by imgur
- [EzGif](http://ezgif.com/) - Online GIF maker and image editor
- [Giflr](https://giflr.com/) - A web app for making or remixing animated GIFs
- [Gif.gf](http://www.gif.gf/labs/face) - Provide a matching GIF for your face
### Community
- [Giphy.com](http://giphy.com)
- [Gifme.io](http://gifme.io)
- [9gag.com/gif](http://9gag.com/gif)
- [Reactionsgifs](http://www.reactiongifs.com/)
- [Educational Gifs](https://www.reddit.com/r/educationalgifs/)
### Niche
- [Starwars-dot-gif](https://github.com/LindseyB/starwars-dot-gif) - Python script to generate GIFs from star wars
### Scripts
#### Frames to GIF
FFmpeg
```bash
ffmpeg -f image2 -i image%d.jpg animated.gif
```
Imagemagick
```bash
convert -delay 20 -loop 0 frames*.png animated.gif
```
Bash script (```frames2gif.sh```) for GraphicsMagick, ImageMagick, FFmpeg
```bash
#!/bin/bash
if [ $# -ne 5 ]; then
echo "please provide the moviename and directory where to store the frames"
echo "./frames2gif.sh [directory] [movie.mp4] [filename.gif] [gm|im|ffmpeg] [png|jpg]"
exit 1
fi
if [ "png" == "$5" ]; then
suffix="png"
else
suffix="jpg"
fi
CONVERT=$(which convert)
GM=$(which gm)
FFMPEG=$(which ffmpeg)
FFPROBE=$(which ffprobe)
FPS=$($FFPROBE -show_streams -select_streams v -i "$2" 2>/dev/null | grep "r_frame_rate" | cut -d'=' -f2 | cut -d'/' -f1)
echo "FPS: ${FPS}"
if [ "im" == "$4" ]; then # use imagemagick
FPS=$(echo "1 / ${FPS} * 100" |bc -l)
$CONVERT "$1/*.${suffix}" -delay ${FPS} -loop 0 "$3"
elif [ "gm" == "$4" ]; then # use graphicsmagick
FPS=$(echo "1 / ${FPS} * 100" |bc -l)
$GM convert "$1/*.${suffix}" -delay ${FPS} -loop 0 "$3"
else # use crappy gif-algorithm from ffmpeg
$FFMPEG -f image2 -framerate ${FPS} -i "$1/%08d.${suffix}" "$3"
fi
```
From [DeepDreamVideo](https://github.com/graphific/DeepDreamVideo), [source](https://github.com/graphific/DeepDreamVideo/blob/master/frames2gif.sh)
#### GIF to frames
```bash
ffmpeg -i video.mpg image%d.jpg
```
```bash
convert -coalesce animated.gif image%05d.png
```
#### High quality GIF
with ffmpeg / based on this [article](http://blog.pkh.me/p/21-high-quality-gif-with-ffmpeg.html)
- Generate a palette :
```bash
#!/bin/sh
start_time=30
duration=3
ffmpeg -y -ss $start_time -t $duration -i input.avi \
-vf fps=10,scale=320:-1:flags=lanczos,palettegen palette.png
```
- Output the GIF using the palette :
```bash
#!/bin/sh
start_time=30
duration=3
ffmpeg -ss $start_time -t $duration -i input.avi -i palette.png -filter_complex \
"fps=10,scale=320:-1:flags=lanczos[x];[x][1:v]paletteuse" output.gif
```
[article](http://blog.pkh.me/p/21-high-quality-gif-with-ffmpeg.html)
#### Optimize GIF
```
convert -layers Optimize output.gif output_optimized.gif
```
#### Lossy GIF Compressor
```bash
./gifsicle -O3 --lossy=80 -o lossy-compressed.gif input.gif
```
[Lossy Gif](https://kornel.ski/lossygif)
#### Making GIF from video
```python
from moviepy.editor import *
clip = (VideoFileClip("input.avi")
.subclip((4,00.00),(5,00.00))
.resize(0.3))
clip.write_gif("output.gif")
```
[article](http://zulko.github.io/blog/2014/01/23/making-animated-gifs-from-video-files-with-python/#converting-a-video-excerpt-into-a-gif)
#### Cinemagraphs
Freezing a region
```python
from moviepy.editor import *
clip = (VideoFileClip("input.avi")
.subclip((4,00.00),(5,00.00))
.resize(0.3)
.fx(vfx.freeze_region, outside_region=(170, 230, 380, 320)))
clip.write_gif("output.gif", fps=15)
```
[article](http://zulko.github.io/blog/2014/01/23/making-animated-gifs-from-video-files-with-python/#freezing-a-region)
```bash
ffmpeg \
-ss ${starttime} -t ${duration} -i ${vidfile} `# body of loop` \
-ss TODO ${starttime} MINUS ${duration} -t ${fadetime} -i ${vidfile} `# lead-in for crossfade` \
-loop 1 -i ${stillfile} `# masked still image` \
-filter_complex "
[0:v]setpts=PTS-STARTPTS[vid]; `# speed adjustment - not needed here, so noop`
color=white,scale=3840x2160,fade=in:st=0:d=${fadetime}[alpha]; `# crossfade alpha, double length ahead of speed change`
[1:v][alpha]alphamerge[am]; `# apply alpha to lead-in`
[am]setpts=PTS+(${duration}-${fadetime})/TB[layer2]; `# speed adjustment and offset for lead-in`
[vid][layer2]overlay[oo]; `# overlay for crossfade`
[oo][2:v]overlay=shortest=1[out1]; `# overlay still image`
[out1]crop=w=${cropfactor}*iw:h=${cropfactor}*ih:y=${yoffset}*ih,scale=${outputwidth}:-1, `# crop and scale`
eq=gamma=${gamma}:contrast=${contrast}:saturation=${saturation},unsharp `# final adjustments`
" -an output.mp4
```
by [Roger Barnes](https://bitbucket.org/snippets/rbarnesatl/6jRB)
#### Perfect Loop
```python
import moviepy.editor as mp
from moviepy.video.tools.cuts import FramesMatches
clip = mp.VideoFileClip("input.avi").resize(0.3)
scenes = FramesMatches.from_clip(clip, 10, 3)
selected_scenes = scenes.select_scenes(2, 1, 4, 0.5)
selected_scenes.write_gifs(clip.resize(width=450), "./outputs_directory")
```
[article](http://zulko.github.io/blog/2015/02/01/extracting-perfectly-looping-gifs-from-videos-with-python-and-moviepy/)
#### Youtube video to GIF
- Download it via youtube-dl and then convert it.
```
youtube-dl https://www.youtube.com/watch?v=V2XpsaLqXc8
```
[Youtube-dl](https://rg3.github.io/youtube-dl/)
- with [vid2gif](http://imgur.com/vidgif) online - [source](https://github.com/jimgur/gif)
#### Grabbing each frame of an HTML5 Canvas
using [PhantomJS](http://phantomjs.org/)
Example with this [canvas](http://www.effectgames.com/demos/canvascycle/?sound=0).
```javascript
var webPage = require('webpage');
var fs = require('fs');
var page = webPage.create();
var NB_FRAME = 100;
var current = 0;
page.open('http://www.effectgames.com/demos/canvascycle/?sound=0',
function(status) {
if (status === "success") {
var current = 0;
var grabber = setInterval(function () {
var frame = page.evaluate(function() {
return document.getElementById('mycanvas').toDataURL("image/png").split(",")[1];
});
fs.write("./frame-" + current + ".png",atob(frame), 'wb');
if (++current === NB_FRAME) {
window.clearInterval(grabber);
phantom.exit(0);
}
}, 1000);
}
});
```
or use [ccapture.js](https://github.com/spite/ccapture.js).
### Miscellaneous
- [Why is the GIF I created so slow?](http://superuser.com/questions/569924/why-is-the-gif-i-created-so-slow/569967#569967) - Using ImageMagick to solve problems concerning GIF speed.
## Use
The best ways to use this list are:
- by browing the [contents](#contents)
- by using command + F to search the contents
## Authors
**[Craig Davison](https://davison.io)**
[](https://github.com/davisonio) [](https://twitter.com/davisonio)
With many thanks to the [contributors](https://github.com/davisonio/awesome-gif/graphs/contributors). :clap:
**Contributions are welcome!** Check out the [Contributing Guidelines](https://github.com/davisonio/awesome-gif/blob/master/CONTRIBUTING.md). :raised_hands:
## License & Credits
Unless otherwise stated:
- Copyright © 2017+ [Craig Davison](https://davison.io). Released under the [CC0 1.0 License](https://creativecommons.org/publicdomain/zero/1.0/).
Based on a [recovered list](https://github.com/sindresorhus/awesome/issues/872):
- Copyright © 2015-2016 [Ismail Baaj](http://ismailbaaj.fr).
