What the GIFvideo → gif, the way creatives need it
product gif for shopify

Shopify takes your GIF and serves shoppers an animated WebP

It is a real saving and it happens without asking you, which quietly changes what is worth optimizing before upload and what is not.

Drop a video, get a GIF free · frame-perfect · nothing leaves your browser Open the converter →

Make a product GIF for a Shopify listing

What the GIF does the whole thing locally, right in your browser: nothing here ever leaves your machine.

  1. Bring in the product footage. Drag the clip onto What the GIF. Phone video is fine, and so is a still if you are sequencing a few angles together.
  2. Trim to the single motion. Three to six seconds covering one action. Frame-accurate in and out points, so the loop starts and ends with the product at rest.
  3. Crop to the product. Lock 1:1 to match a product gallery, or 4:5 for a taller shot, and cut the studio out of frame.
  4. Set size, speed, and palette. 800 to 1200 px on the long edge, 12 to 15 fps, 128 colors so fabric and gradients do not band.
  5. Export and place it. Download the GIF and add it as product media. Put a still first in the gallery and the loop behind it, then write real alt text.

The CDN swaps the format on the way out

Shopify's developer changelog documents it directly: animated GIFs uploaded to a store are converted to animated WebP automatically, cutting delivered bytes by up to about half, with a GIF served back to any browser that cannot handle WebP. You upload a .gif. Most shoppers receive something else, and neither of you is consulted.

This is good news with a catch. The good news is that a well-made GIF gets a free efficiency pass on the way to the customer, so squeezing your upload to the last kilobyte is less urgent than it is for email or a README. The catch is that a re-encode is a re-encode: everything you threw away to make the file small, mainly colors and frames, is gone before the conversion starts, and WebP cannot invent it back. Feed the pipeline a clean 128-color loop and let it do the compressing.

What the conversion does not fix

Format is the CDN's problem. Everything below is still yours.

Aim for under 2 MB before upload. If a finished loop is heavier, the compression page works through the levers in order of payoff.

Shopify's own video is usually the better listing asset

Worth being straight about, since we sell the loop. Native product video on Shopify is a proper media type with a real player: it keeps audio, it does not pay GIF's per-frame tax, and it can be set to autoplay muted and loop. That last part is a theme setting, passed to the video tag by whoever built your theme, not something Shopify guarantees, so check yours before assuming a product video will move on its own. For a 30-second product story, it wins on every measure that matters.

A GIF earns its place where video cannot go or is not worth the weight. Inside the description block, beside a paragraph of copy, where a player would be clumsy. In the abandoned-cart email, where video arrives as a thumbnail and a GIF arrives moving, which the email guide covers in detail. In a support article or a size guide. And for the three-second detail that does not deserve a play button: the magnetic snap, the color shifting in the light.

Put differently: video for the story, a loop for the detail. Reaching for one because you did not know about the other is the expensive mistake.

A heavy loop above the fold is a conversion problem

The largest image in the first screenful of a product page is usually what browsers measure as Largest Contentful Paint, the metric Google reports on and shoppers experience as the page being slow. Drop a multi-megabyte animation there and you have made the number worse for every visitor, including everyone who was never going to scroll.

The layout fix costs nothing. Lead with a sharp still, put the loop second in the gallery or down in the description where it loads after the page is usable, and let the first paint be light. Mobile shoppers on a cellular connection, which is most of them, feel this more than any wording change you could make on the page.

An unlaunched product on someone else's server

The footage for a product GIF is almost always of a thing that is not for sale yet. Packaging that has not been announced. A colorway with a date attached. A price on a tag in the corner of frame. Every free online converter asks you to upload that file, and the terms you agree to while doing it are not written to protect a launch calendar.

This one has no upload step to worry about. The editor reads the file from your disk, encodes it with your own processor, and hands the result back to your Downloads folder. The first server that ever sees the loop is your own store, on the day you decide. That is not a policy, it is just how the thing is built.

Show the detail that sells it

Three seconds of the product doing the thing, cropped to the gallery and light enough to keep the page quick. Built on your machine, before the launch date.

Open the converter

Questions, answered

Does Shopify support animated GIFs on product pages?
Yes. GIF is an accepted product media type and animation is supported. Shopify's CDN converts animated GIFs to animated WebP for browsers that support it, and serves a GIF to those that do not.
How big can a Shopify product GIF be?
Product and collection images need to come in under 20 MB as of this writing, but that is a ceiling, not a target. Build for under 2 MB so the page stays fast.
Why is my Shopify GIF not animating?
Some surfaces and apps render a still rather than the animation, and reports of this come and go. Design frame one to sell the product on its own, and keep a static image first in the gallery.
GIF or Shopify video for a product listing?
Video for anything long, narrated, or story-shaped, since it keeps audio and gets a real player. A GIF for a three-second detail, and for the places video cannot reach, like an email or a description block.
Will a product GIF slow down my store?
It can, if it sits above the fold. The biggest image in the first screenful is usually what gets measured as Largest Contentful Paint. Keep the loop out of that slot and under 2 MB.