CruxDevCruxDev Tools Studio Prompts
image Utility • Zero-Server Privacy • 100% Client-Side

GIF Maker

Make an animated GIF from images or a short video. Reorder frames, set per-frame delays, loop count, size and colours, with optional dithering. Encoding runs in a background worker with progress.

Overview

Builds an animated GIF from a set of images or from a short video, entirely in your browser. Reorder frames, set a delay for each one, choose the loop count, output width, number of colours and dithering, and watch encoding progress with a Cancel button. The GIF encoder is written for this site and runs in a background worker.

How It Works

Drop images and they appear as a numbered frame list with thumbnails. Move frames up or down, remove them, reverse the order, or click Boomerang to append the frames backwards for a back-and-forth loop. Each frame has its own delay in milliseconds, and Apply to all copies one value to every frame. Choose a width, colours per frame, loop setting and whether to dither, and whether frames of a different shape are letterboxed or cropped. Dropping a video instead opens the video clip editor.

Step-by-Step Usage Guide

  1. Drop the images you want as frames, or one short video.
  2. Put the frames in order with the arrows, Reverse or Boomerang.
  3. Set a frame delay, then adjust individual frames if some should hold longer.
  4. Choose width, colours, loop count and dithering.
  5. Click Create GIF and download the file when it is ready.

Technical Specifications & Standards

Every frame is drawn to a canvas at the output size and its pixels are sent to a Web Worker, which writes a GIF89a file. Each frame gets its own colour table, built by median cut: colours are counted in a 32 by 32 by 32 histogram, the busiest box is split at its median along its widest channel, and each palette entry is the true average of its box, so flat graphics with few colours keep exact values. Pixels are matched to the nearest palette colour through a cached lookup, optionally with Floyd-Steinberg error diffusion to smooth gradients. Indices are compressed with variable-width LZW from 2 to 12 bits, resetting the dictionary at 4096 codes. Transparent pixels get a reserved index with restore-to-background disposal. A NETSCAPE2.0 block sets the loop count; Play once leaves it out. Delays are stored in hundredths of a second, so 33 ms becomes 30 ms, and frames are queued three at a time to keep memory bounded.

Targeted Use Cases

  • Turning a sequence of UI screenshots into a short demo for a README or pull request.
  • Making a looping product spin from photos taken at different angles.
  • Animating a set of sketches or comic panels into a flipbook.
  • Creating a reaction GIF from a few frames of a video.
  • Building a simple loading or status animation for a chat app.

Notes & Gotchas

  • Keep the width at 480 px or less for chat and social posts; file size grows with every pixel.
  • Use 64 or 128 colours for screenshots and flat graphics, and 256 with dithering for photos.
  • Give the last frame a longer delay so viewers can read the final state before it loops.
  • Turn dithering off for pixel art and line drawings, where it adds noise.

Frequently Asked Questions

Why is my GIF so large?

GIF compresses poorly compared with video. Size grows with width, height, number of frames and colours, and dithering adds noise that compresses less well. Reduce the width, use fewer colours or frames, or switch dithering off.

What is the fastest frame delay a GIF can use?

GIF stores delays in hundredths of a second, and most browsers show any delay under 20 ms as 100 ms. Use 20 ms or more, which is 50 frames per second, for predictable playback.

Can I make a GIF with a transparent background?

Yes. Turn on Transparent background and use PNG frames with transparency. GIF has on-off transparency only, so semi-transparent edges become either fully transparent or fully opaque.

Does it upload my images?

No. Frames are drawn and encoded in your browser, with the heavy encoding running in a background worker so the page stays responsive. Nothing leaves your device.

Related tools

  • Video to GIF Converter - Turn a clip of an MP4, WebM or MOV video into an animated GIF. Trim start and end against a preview, choose frame rate, width, speed and colours, then download. Nothing is uploaded.
  • GIF Frame Splitter - Split an animated GIF into PNG frames composited exactly as browsers play them. See a table of frame delays and disposal, save single frames or download a ZIP with all frames and a delays CSV.
  • Photo Collage Maker - Arrange 2 to 9 photos in grid and feature layouts. Adjust spacing, corner radius, background, aspect ratio and output width, drag photos between cells, zoom and pan each crop, and export PNG or JPG.
  • Image Converter (PNG, JPG, WebP, AVIF, BMP, ICO, GIF) - Batch convert images between PNG, JPG, WebP, AVIF, BMP, ICO and GIF in your browser. Set quality, pick a background for transparent areas, keep file names and download everything as one ZIP.
  • Motion Graphics Maker (Animated Text, Logos & Intros) - Keyframe animated text, logos, lower thirds and intros in your browser. Easing graph, trim paths, masks, 33 presets, 9 templates. Export WebM, MP4, GIF, PNG frames, Lottie or CSS.
  • CSS Triangle & Shape Maker - Generate pure CSS border triangles, chevrons, and speech indicators for all 8 cardinal directions.