SVGSketch Learn

Convert SVG to GIF, Still or Animated

Export a still or animated GIF straight from the SVG, encoded in your browser, with the frame rate and loop you choose.

Open SVGSketch

Quick answer

Open the SVG in SVGSketch, open the Export panel (Ctrl+Shift+E), choose GIF from the Animated group of the Format dropdown, set Frame Rate, Duration and Loop if the drawing is animated, and click Download. GIF export is part of SVGSketch Pro, and the encoding never leaves your browser.

Steps at a glance

  1. Open the SVG

    Drag the .svg onto SVGSketch or use File > Open... (Ctrl+O).

  2. Add keyframes

    Open the Animation panel from the Animation menu and animate the shapes you want to move.

  3. Choose GIF

    In the Export panel (Ctrl+Shift+E), pick GIF under Animated in the Format dropdown.

  4. Set timing

    Set Frame Rate, Duration and Loop in the Animation section of the export settings.

  5. Download

    Click Download; the GIF is encoded locally in the browser.

Step 1: Open the SVG

Drag the .svg onto app.svgsketch.com or use File > Open... (Ctrl+O). A drawing without keyframes exports as a single-frame GIF, which is the right output for a logo or icon that a chat app or a wiki will only accept as GIF. A drawing with keyframes exports as an animated GIF.

Step 2: Add motion, if you want it

Open the Animation panel from the Animation menu and add keyframes to the shapes you want to move, fade or recolor. Our guide on how to animate SVG walks through position, opacity and transform tracks; everything it produces is what the GIF exporter samples, frame by frame, at the rate you pick in the next step.

Step 3: Choose GIF in the Export panel

Open the Export panel (Ctrl+Shift+E) and pick GIF under Animated in the "Format" dropdown. GIF is a Pro format: on a free account the dropdown still lists it, and choosing it opens the Pro pitch with the 14-day free trial.

Each export item has its own source. Leave it on the document to export everything inside the viewBox, or pick a View or the current selection to export only part of the drawing.

Step 4: Set frame rate, duration and loop

Open the item's settings. The "Animation" section has "Frame Rate", "Duration" and "Loop". 12 to 15 frames per second keeps a decorative loop small; 24 or 30 looks smoother and costs proportionally more bytes, because a GIF stores every frame in full.

Duration defaults to the length of the timeline. Shorten it to export a segment, or leave Loop on so the GIF plays continuously wherever it is embedded.

Step 5: Download, and keep the SVG

Click Download. The frames are rendered and encoded in your browser, so nothing is uploaded and there is no queue to wait in. GIF is limited to 256 colors per frame, so a gradient-heavy drawing will show banding; for photographic or gradient content an animated WebP or an MP4 export keeps the colors intact.

Save the SVG (File > Save, Ctrl+S) alongside the GIF so you can change the timing or the artwork later and export again.

FAQ

Do I need an account to export a GIF?

GIF export is part of SVGSketch Pro, which starts with a 14-day free trial. Opening, editing and exporting SVG and PNG need no account at all.

Can I export a still GIF from a drawing with no animation?

Yes. A drawing without keyframes exports as a single-frame GIF, which is what a platform that only accepts GIF uploads needs.

Why does my GIF look grainy?

GIF stores at most 256 colors per frame, so gradients and photographs band. Flat-color artwork exports cleanly; for rich color, export an animated WebP or a video instead.

Is the SVG uploaded to convert it?

No. The frames are rendered and encoded in your browser. The SVG never leaves your computer.

Open your SVG in SVGSketch

Start with a blank canvas, import an SVG, or use the editor as a conversion and cleanup step.

Open SVGSketch