GIF圧縮ツール

GIFアニメを圧縮の強さごとに実際に作って、サイズを比べて選べます

GIF圧縮ツールは、動くGIFを書き直してファイルサイズを小さくします。ロスレスから最大までの5段階をすべて実際に作り、段階ごとの結果サイズを棒で表示します。たとえば動画から作ったサンプルのGIFアニメ(360 × 240、32フレーム、1.70 MB)は、「標準」で947 KB(−44.1%)になりました。画面録画のサンプル(400 KB)は、画素をひとつも変えない「ロスレス」だけで87 KB(−78.4%)になっています。

元と結果は、ひとつの画面で分割線をドラッグして同じ位置を見比べられ、一時停止してから1フレームずつ送ることもできます。下のフレームマップには、フレームごとに使っているバイト数が出るので、どの場面が重いのかが分かります。目標サイズを選ぶと、その範囲に収まる最も軽い段階を選び、それでも超えるときは横幅を縮めて合わせます。GIFはサーバーに送らず、このブラウザー内だけで処理します。「GIF 圧縮」や「GIF 容量 減らす」を調べている方が、アップロードなしで試せるように作りました。

こんなときに使います

• アップロードできるサイズが決まっている場所に出すとき: GitHubのドキュメントによると、IssueやPull Requestのコメントに添付する画像とGIFは10MBまでです。Issueに添付したい画面録画がこれより大きいときは、目標サイズで10 MBを選べば合わせられます。チャットや掲示板、メールにも、それぞれ添付の上限があります。投稿先の案内を確認して、それより少し小さく合わせてください。
• ブログやネットショップの商品ページが重いとき: 商品の使用シーンのように、動画から作ったGIFアニメは1枚で数MBになりやすく、ページに何枚もあるとスマートフォンでは開くのが遅くなります。画質をほとんど変えない「軽め」「標準」だけでも、サイズは大きく下がります。
• 画面録画のGIFをドキュメントに入れるとき: 説明書や操作手順に入れる画面録画は、ほとんどの領域が止まっていて、一部だけが動きます。こうしたGIFは、変わった部分だけを書き直す「ロスレス」で、画質を落とさずに大きく小さくなります。
• 受け取ったGIFアニメをもう一度出すとき: 何度も保存し直されたGIFは、フレームごとに全画面と色表を持ち直していることがよくあります。元より大きくなる場合、このツールは元のファイルをそのまま渡すので、損をせずに一度試せます。

使い方

1. GIFを作業エリアにドロップするか、「GIFを選ぶ」を押します。コピーしたGIFはCtrl+Vで貼り付けても構いません。開けるのはGIF1個、50 MBまでです。
2. 開くとすぐ「標準」で結果を作り、残りの4段階も順に作って、圧縮の強さの棒に実際のサイズを入れていきます。選びたい段階を押すと、その結果に切り替わります。
3. 投稿先に上限があるときは、目標サイズ(1～15 MBまたは指定)を選びます。その範囲に収まる最も軽い段階が選ばれ、「強め」でも超えるときは横幅を縮めて合わせます。
4. 必要なら、横幅(元・75%・50%・指定)とフレーム(すべて・2～4枚に1枚)を変えます。「細かく指定」を開くと、色数とロスの度合いを個別に決められます。
5. ステージの分割線をドラッグして、元と結果を見比べます。「一時停止」を押すかフレームマップを押すとそのフレームで止まり、前後のボタンや矢印キーで1枚ずつ送れます。
6. 「GIFを保存」を押します。ファイル名の末尾にサイズが付きます(例: sample-947kb.gif)。

圧縮の強さ5段階の違い

段階が上がるほど、元と違う画素をより多く許します。下の表のサイズは、2つのサンプルをこのツールで実際に小さくして測った値です。PSNRは、元と結果の画素の差をデシベルで表した値で、高いほど元に近くなります。GIFアニメのサンプルでは、35 dB前後の「標準」までは2倍に拡大して並べても違いがほとんど分からず、30 dBを下回る「強め」「最大」では白い背景に細かな点が出て、リンゴや洋ナシのようななめらかな面がざらつきました。同じ数値でもGIFによって見え方が違うので、目安としてだけ使ってください。

• 動画のGIFアニメは、ロスレスでは小さくなりませんでした: このサンプルは画面がゆっくり拡大していき、画素ごとにノイズもあるため、すべてのフレームのすべての画素が変わります。書き直せる部分がないので、ロスレスの結果は元より小さくならず、このツールは元をそのまま渡します。
• 画面録画は、ロスレスがほとんどを担いました: 元はフレームごとに全画面を持ち直していましたが、実際に変わったのは数字・グラフ・カーソルだけです。その部分だけを書くと−78.4%になり、ロスのある段階でさらに小さくしても、差は数KBです。
• 「強め」からは色が減ります: 128色・64色にすると、空や暗い布のように色が続く面に段差(帯)が出て、ロッシーLZWの横縞も見え始めます。そのため棒には斜線を入れて区別し、目標サイズに合わせるときも「最大」は自動では選びません。

画質を落とさずに小さくなる理由

GIFの仕様(GIF89a)では、フレームごとのイメージ記述ブロックに、画面の左と上を基準にした位置と、横・縦の大きさを書きます。そのため、1フレームが画面全体ではなく、その中の小さな長方形でもよいことになります。また、フレームごとに透明色の番号をひとつ決められ、仕様によると、その番号の画素は画面を変えないので、前の場面がそのまま見えます。このツールはこの2つを使って、画素を変えずにサイズを下げています。

1. 変わった場所を囲む長方形だけ: 前のフレームと違う画素をすべて囲む、最小の長方形だけを保存します。カーソルだけが動く画面録画なら、1フレームが爪ほどの長方形になります。
2. 長方形の中の同じ画素は透明番号で: 長方形の中でも、変わっていない画素は透明番号で空けます。同じ番号が長く続くと、LZW圧縮がとてもよく効きます。ただし、散らばった画素が少しずつ変わる場面では、元の色を使うほうが小さいことがあります。そこで、フレームごとに2～3通りの方式をすべて圧縮してみて、最も小さいものを使います。
3. 同じ場面は時間だけ合算: 前のフレームと画素がまったく同じフレームは保存せず、その表示時間を前のフレームに足します。全体の再生時間は変わりません。
4. 色は元のまま: すべてのフレームの色を合わせて255色以下なら全体の色表をひとつ、それより多ければ、フレームごとにその長方形で使われた色だけの色表に、元の色をそのまま書きます。

透明だった場所が再び透明に戻る必要があるGIF(背景が透明なステッカーのように動く絵)は、前のフレームを「背景で消去」(処理方法2)に変えてその場所を空け、そのうえで次のフレームを描きます。こうして作った結果が、元と画素単位で同じかどうかは、このツールのテストでフレームごとに照合しています。

ロスのある圧縮は何を捨てるのか

GIFは、画素の番号をLZW(Welch 1984)で圧縮します。前に出てきた番号の並びを辞書にためておき、同じ並びがまた出てきたら、辞書の番号ひとつで書く方式です。辞書の番号は最大12ビットなので、辞書には4,096個まで入ります。ロッシーLZWは、辞書から並びを探すときに、色がごくわずかに違う画素も同じものとみなして、より長い並びをつなげて書きます。gifsicleの--lossyオプションと同じ考え方で、並びが長くなるほど書く番号が減り、ファイルが小さくなります。

• 何が変わるのか: 画素ひとつひとつが、元の色に少し違う近い色に置き換わります。差は次の画素へ回して平均の色が保たれるようにしていますが、段階が高いと横に長い縞が見えます。写真のような動画のGIFアニメでは効果が大きく、単色の面が多い画面録画では効果が小さくなります。
• 近い画素はそのまま残す: 動画から作ったGIFアニメは、止まっている背景もノイズのせいでフレームごとに画素が少しずつ変わります。ロスのある段階では、前の画面との色の差がごく小さい画素を「変わっていない」とみなして、透明番号で空けます。比較は常に現在のフレームの元の色と行うので、フレームが進んでも差は積み重なりません。
• 透明な場所には手を付けません: 透明と不透明は、ロスのある段階でも入れ替えません。背景が透明なステッカーのようなGIFは、輪郭がそのまま残ります。

色数を減らすと何が起きるか

GIFの色表は、2、4、8…256のように2のべき乗の大きさで、ひとつの色表には最大256色が入ります。色を128色や64色に減らすと、画素の番号に必要なビットが減ってファイルが小さくなります。このツールは、すべてのフレームから均等に選んだ画素でmedian cut(Heckbert 1982)を使って色を選び、全フレームが同じ全体の色表を使います。フレームごとに色が変わらないのでちらつきが少なく、フレームごとに色表を書かなくて済みます。

• 原色のイラストやアイコン、画面録画は、もともと色が少ないので、64色でも差は小さくなります。
• 空・肌・影のように色が続く写真は、128色から帯が見えることがあります。誤差拡散(ディザリング)は使いません。ディザリングはフレームごとに点の模様が変わり、変わる画素が増えてファイルが大きくなるためです。
• 場面が何度も切り替わる長いGIFアニメは、場面ごとに色が違うので、全体の色表ひとつに減らすと、一部の場面の色が粗くなることがあります。そうしたGIFは「標準」までにするか、横幅を縮めるほうが向いています。

横幅とフレームを減らすと

横幅を縮めると、縦も同じ比率で縮むので、画素数はその2乗で減ります。横幅75%なら画素は56%、50%なら25%です。フレームを間引くと、2枚に1枚だけを残し、抜けた場面の時間は残ったフレームに足して全体の長さを変えません。下は、「標準」の段階はそのままで、サイズとフレームだけを変えた結果です。かっこの中は、元からの減少率です。

動画のGIFアニメは、横幅を縮めたりフレームを間引いたりするほど、ほぼ画素数に比例して小さくなりました。画面録画は変わる部分が小さいので、横幅を半分にしても、減る幅は動画より小さくなります。小さな文字がある画面録画は、横幅を縮めると文字が読めなくなりやすいので、サイズよりも先に段階を変えてみるのがおすすめです。

GIFの遅延時間は、1/100秒単位です。Safariが使うWebKitのソースには、Firefoxと同じように、0.01秒以下と書かれたフレームを0.1秒で表示するという趣旨のコメントがあります。そのためこのツールは、フレームを合算するとき、0や0.01秒と書かれたフレームを0.1秒として数えて足します。合算しないフレームの遅延値は、元のままです。

目標サイズはこの順番で合わせます

1. 現在の横幅・フレームの設定で、ロスレスから「強め」まで順に実際に作り、目標以下になる最初の段階(最も軽い段階)を選びます。元がすでに目標以下で、ロスレスでも小さくならないときは、元をそのまま渡します。
2. 「強め」でも超えるときは、「強め」のまま横幅を縮めます。サイズがおおよそ画素数に比例することを使って次の横幅を見積もり、実際に作って測る作業を何度か繰り返して、目標に収まる最大の横幅を探します。
3. 見つけた横幅で5段階をもう一度測り、その横幅で目標に収まる最も軽い段階を表示します。結果欄には「横幅を360 → 300pxに縮めました」のように、何を変えたかを書きます。
4. 段階を自分で押したときは、その段階をそのまま使い、目標を超えていれば赤い文字でお知らせします。

サイズは、1 KB = 1,000バイト、1 MB = 1,000,000バイトで数えます(国際単位系の接頭辞)。画面に出る数字は切り上げなので、「2 MB以下」と出れば、実際のバイト数も2,000,000以下です。投稿先がMiB(1,048,576バイト)で数える場合は、同じ数字でも少し余裕があります。

フレームマップの読み方

フレームマップの横は時間で、1マスが元のフレーム1枚です。マスの幅はそのフレームが表示される時間なので、長く止まる最後の場面は幅が広く見えます。灰色の棒は元でそのフレームが使ったバイト数、オレンジの棒は結果で使ったバイト数です。高さは平方根の目盛りなので、小さなフレームも見えます。

• 最初のフレームがいちばん大きくなります: 最初のフレームは、画面全体を描く必要があるので、いつも大きくなります。画面録画のサンプルでは、最初のフレームのあとオレンジの棒がとても低くなります。変わった場所だけを保存しているためです。
• 斜線のマスは、結果に単独では存在しないフレームです: 前のフレームと同じで時間だけ合算されたか、フレームの間引きで抜けたフレームです。その時間は、前のフレームが表示されます。
• 棒が高くなっている場所は、場面が切り替わった場所です: 動画のGIFアニメで棒が急に高くなるマスは、画面全体が変わった場面です。その区間が長いときは、フレームの間引きの効果が大きくなります。

マップを押すと、そのフレームで止まり、ステージに元と結果の同じ時刻のフレームが出ます。矢印キーで1フレームずつ送りながら、ロスが目立つ場面を探せます。

よくある間違い

• 拡張子だけを.gifに変えたファイル: PNG・JPG・WebPの名前だけを変えたファイルはGIFではないので、開けません。写真を何枚か並べてGIFアニメにするにはGIF作成ツールを、動画をGIFアニメにするには動画GIF変換ツールを使います。
• 横幅を半分にすればファイルも半分になるという思い込み: 画素は4分の1になりますが、ファイルサイズは場面がどれだけ変わるかによって違います。上の表のとおり、動画と画面録画では減り方が違います。
• フレームを間引けば速くなるという思い込み: 抜けたフレームの時間は残ったフレームに足されるので、再生時間は変わりません。動きがなめらかでなくなるだけです。
• すでに小さくしたGIFをもう一度小さくする: ロスのある段階で小さくしたGIFをもう一度小さくすると、ロスが積み重なります。元のファイルがあるなら、元から一度で目的の段階に小さくするほうがきれいです。
• 「ロスレス」ならいつも小さくなるという期待: すでによく圧縮されたGIFは、書き直しても小さくなりません。そのときこのツールは元をそのまま渡し、結果欄にその旨を書きます。
• MBとMiBの混同: 上限が「10MB」でも、サービスによって10,000,000バイトの場合も10,485,760バイトの場合もあります。目標を上限より少し小さめにしておくと安全です。

制限

• 開けるのは、GIF1個、50 MB、フレーム1,000枚、横 × 縦 × フレーム数が1億5千万画素までです。横・縦はそれぞれ8,000pxまでです。この数字はGIF形式の上限ではなく、ブラウザーが固まらないようにこのツールが決めた範囲です。
• 表のサイズは、2026-10-21にこのツールのエンジンで測った値です。エンジンが同じなら、どのブラウザーでも同じサイズになりますが、エンジンを直すと変わることがあります。
• 段階ごとの画質は、PSNRのような数字だけでは決めていません。同じ段階でも、GIFによって目に見える度合いが違うので、ステージで直接確認してください。
• 結果は常にGIFです。長い動画のGIFアニメは、同じ画質のMP4・WebMの動画や、動くWebPのほうがずっと小さくなります。web.devは、ウェブページの大きなGIFを動画に置き換えることを勧めています。投稿先が動画を受け付けるなら、そちらのほうが向いています。
• コメントやXMPのような付属情報と、インターレース保存は、結果に残しません。繰り返し回数(ずっと繰り返し・1回だけ再生・n回)は元のままです。
• ステージの再生は、ブラウザーが2つのGIFを別々に再生しているので、とても長いGIFでは、元と結果が少しずれることがあります。同じ時刻を正確に比べるには、一時停止してフレームを送って見てください。

基準: 2026-10-21に、下の資料の該当する文を確認しました。サイズの数字は、このツールのエンジンでサンプルGIFを小さくして測った値です。

出典

• 01W3C — Graphics Interchange Format Version 89aイメージ記述ブロックの位置・大きさ、色表の大きさ2^N+1、処理方法0～3、遅延時間(1/100秒)、透明色の番号、LZWコードは最大12ビット
• 02gifsicle マニュアル — --lossy, --optimizeロッシーLZWで画素の色を変えてサイズを下げるオプションと、フレームの最適化の段階
• 03Welch, T. A. (1984). A Technique for High-Performance Data Compression. Computer, 17(6), 8–19LZW圧縮
• 04Heckbert, P. (1982). Color image quantization for frame buffer display. SIGGRAPH '82, 297–307median cutによる減色
• 05GitHub Docs — Attaching files画像とGIFは10MBまで
• 06web.dev — Replace animated GIFs with video for faster page loads大きなGIFを動画に置き換えると大幅に小さくなる
• 07WebKit — ScalableImageDecoder.cpp0.01秒(10 ms)以下と書かれたフレームを、Firefoxと同じく0.1秒で表示するというコメント
• 08NIST — Prefixes for binary multipleskilo = 10³, kibi = 2¹⁰

よくある質問

あわせて使いたいツール