写真を何枚もつないで、コマごとに時間と順番を決められます
GIF作成は、写真やGIFを入れて、動くGIF1つにまとめるツールです。入れた写真は1枚ずつコマになり、下のフィルムの帯ではマスの幅がそのまま、そのコマが画面に出ている時間になります。最初に入っている例の写真4枚(1枚1秒)を長辺480pxで作ると367 KB、コマの間をなめらかに切り替える設定にすると1.96 MBになります。設定を変えるたびにGIFを実際に作り直し、そのサイズを表示します。
写真はいま使っているブラウザーの中だけで処理し、サーバーには送りません。再生ボタンで流れを確かめたら、「GIFを保存」を押すとそのままファイルとしてダウンロードできます。
動画ではなくGIFにする理由
GIFは音が出ない代わりに、ふつうの画像と同じようにWebページへ置くだけで自動的に再生され、決めたとおりに繰り返されます。再生ボタンを押してもらう必要がないので、短い動きや手順を見せたいときによく使われます。
- 使い方の説明: アプリの画面を手順ごとにキャプチャして1~2秒ずつ切り替えれば、長い文章より早く順序を伝えられます。
- ビフォーアフター: 補正前後の写真や、片付け前後の部屋を2枚で交互に見せます。なめらかな切り替えをオンにすると、変わった部分がゆっくり現れます。
- 写真のまとめ: 旅行やイベントの写真を1つのファイルにまとめて、一度に見せられます。
- イラストのアニメーション: 少しずつ違う絵を順に撮り、0.1秒前後で切り替えると、短いアニメーションになります。
投稿先ごとに容量の上限があるため、保存する前にサイズを確認しておくと安心です。たとえばGitHubのIssueやプルリクエストに添付する画像とGIFは、10MBまでです。
作り方の手順
- 写真やGIFを選ぶか、作業エリアにドラッグ&ドロップします。コピーした画像はCtrl+V(Macは⌘V)で貼り付けることもできます。最初に入れたファイルは例と入れ替わり、2回目以降は末尾に追加されます。まとめて選んだファイルは、名前に含まれる数字の大きさ順(1、2、10)に並びます。
- フィルムの帯で順番を決めます。マスをドラッグして動かすか、マスを選んでからステージ下の矢印ボタンで1つずつ移動します。
- 時間を決めます。上の「全コマ」ボタンでまとめて合わせ、特定のコマはマスの右端をドラッグするか、「このコマの時間」欄に数字を入れます。
- 縦横比と長辺を選びます。「1枚目」は最初の写真の縦横比をそのまま使います。縦横比が違う写真は、「全体表示」にすると余白ができ、「全面に拡大」にすると端が切れます。
- 必要に応じて、文字、なめらかな切り替え、逆再生・往復再生、1回だけの再生を選びます。
- 再生ボタンで確かめてから「GIFを保存」を押します。
コマごとの時間の決め方
GIFは、コマごとに次へ進むまでの待ち時間を1/100秒単位で記録しています。そのためこのツールも時間を0.01秒単位で受け付け、1コマに0.02秒から10秒まで入れられます。0.01秒以下と記録されたGIFは、Safari(WebKit)とFirefoxが0.1秒に遅くして表示するので、速く見せようとして入れた値がかえって遅くなってしまいます。
| 1コマの時間 | 1秒で進むコマ数 | 向いている用途(例) |
|---|---|---|
| 0.05秒 | 20コマ | なめらかなイラストのアニメーション |
| 0.1秒 | 10コマ | 短いイラストのアニメーション、連続撮影した写真 |
| 0.5秒 | 2コマ | テンポよく切り替える写真のまとめ |
| 1秒 | 1コマ | 写真のまとめ、ビフォーアフター |
| 2秒 | 0.5コマ | 文章を読む必要がある使い方の説明 |
読み込んだGIFは、コマごとに記録された時間をそのまま引き継ぎます。ただし、0秒や0.01秒と記録されたコマは、ブラウザーが実際に表示するとおり0.1秒に置き換えます。「2倍速く」と「2倍遅く」は全コマの時間を同じ割合で変えるので、コマごとに違っていたリズムはそのままに、速さだけを変えられます。
容量は何で決まるのか
例の写真4枚(元サイズ720 × 480)を1枚1秒にして、長辺と切り替え方だけを変え、このツールで実際に作ったサイズです。
| 設定 | 幅 × 高さ | コマ数 | 長さ | 容量 |
|---|---|---|---|---|
| 長辺 320px | 320 × 213 | 4コマ | 4秒 | 180 KB |
| 長辺 480px(初期設定) | 480 × 320 | 4コマ | 4秒 | 367 KB |
| 長辺 640px | 640 × 427 | 4コマ | 4秒 | 601 KB |
| 長辺 800px | 800 × 533 | 4コマ | 4秒 | 874 KB |
| 480px + なめらかな切り替え | 480 × 320 | 20コマ | 4秒 | 1.96 MB |
| 480px + 往復 | 480 × 320 | 6コマ | 6秒 | 576 KB |
- 写真はコマごとにほぼそのまま保存されます。 GIFは前のコマから変わった部分だけを保存できますが、別の写真に切り替わるとほとんどの画素が変わります。そのため写真のGIFはコマ数に比例して大きくなり、画面録画のように一部だけが動くGIFはずっと小さくなります。
- 長辺を小さくすると、画素数は2乗で減ります。 480pxから320pxに小さくすると画素数は44%になり、容量は367 KBから180 KBになりました。
- なめらかな切り替えは、コマの間ごとに混ぜた絵を4枚入れます。 各コマの時間の最後の40%(最大0.4秒)で次のコマと混ぜるため(0.2秒より短いコマは混ぜません)、全体の長さは変わりませんが、コマ数が4から20になり、容量は約5.3倍になりました。
- 往復は、最後まで進んだあとに戻るコマを追加します。 4コマなら1-2-3-4-3-2の順で6コマになります。繰り返しを「1回」にすると、最初のコマに戻って止まるよう1-2-3-4-3-2-1の7コマになります。
保存したGIFをさらに小さくしたいときは、GIF圧縮ツールで色数と非可逆圧縮の段階を選べば、同じ動きをより小さいファイルにできます。
256色と透明な背景
GIFは1コマにつき最大256色までしか使えません。このツールは、写真1枚ごとにその写真の色を255のグループに分け、グループごとの平均色を1つずつ選び(メディアンカット)、残る1つは透明用にとっておきます。コマごとに色の表が別なので、異なる写真に切り替わっても、それぞれの写真の色がつぶれにくくなります。同じGIFから取り出したコマは1つの色の表を共有し、動かない背景の色がコマごとにぶれないようにしています。色が255色以下の図表やスクリーンショットは、元のサイズのまま文字を入れずに使えば、色を減らさずそのまま使います。サイズを変えたり文字を入れたりすると、縁に中間色が生まれるため色を選び直します。
空や夕焼けのように色がゆっくり変わる部分では、色数が足りずに縞模様が見えることがあります。例の夕暮れの海の写真では、太陽の周りがそれにあたります。
背景を「透明」にすると、余白と、もともと透明だった部分が透明のまま保存されます。GIFの透明はオンとオフの2通りしかないため、半透明の縁は、半分以上不透明なら色に、それより薄ければ透明に変わります。そのため、影やぼかした縁は階段のようにざらついて見えることがあります。
すでにあるGIFを直す
GIFを入れると、コマごとに1枚ずつ展開してフィルムの帯に並べます。前のコマの上に一部だけ描き足すGIFでも、その時点で画面に見えている絵全体として展開しておくので、一部のコマを削除したり順番を変えたりしても、表示は崩れません。
- 速さを変える: 「2倍速く」か「2倍遅く」を押します。もう一度押すと4倍になります。
- 逆再生: 順序を「逆再生」にします。
- 行って戻る(ブーメラン): 順序を「往復」にします。
- いらないコマを削除: マスを選んで「このコマを削除」を押します。
- 写真と連結: GIFの前後に写真を入れて、タイトルのコマや最後のコマを付け足します。
直したGIFは最初から作り直すため、すでに小さくしてある元のファイルより大きくなることがあります。そのときは、保存したあとにGIF圧縮ツールでもう一度小さくします。
よくある失敗
- 縦長と横長の写真を混ぜたまま「1枚目」の縦横比にしておく: 1枚目が横長の写真だと、縦長の写真の左右に広い余白ができます。「全面に拡大」に変えるか、1:1の縦横比を選びます。
- コマが多いのに長辺を大きくしておく: 写真のGIFは、コマ数 × 画素数に比例して大きくなります。コマが20を超えるときは、まず長辺を320~480pxに合わせてみます。
- なめらかな切り替えをオンにしたまま容量の上限に引っかかる: 混ぜた絵がコマごとに4枚ずつ増えます。上限がぎりぎりなら「即時」に変えます。
- iPhoneの写真(HEIC)をそのまま入れる: ブラウザーがHEICを読み込めないと、このツールにも入れられません。先にHEIC JPG 変換ツールで変換します。
- 動きのあるWebP・PNGを入れる: 1枚目だけが入ります。動きが必要ならGIFで入れます。
- 文字を長く書く: 文字は画面の幅に合わせて小さくなり、やがて2行に分かれます。小さいGIFでは、短く書くほうが読みやすくなります。
制限
- コマは300まで、ファイルは1つあたり50MBまで入れられます。長辺が1,200pxを超える写真は、入れるときに1,200pxへ縮小します。
- 作成するGIFの長辺は16~1,000pxで、幅 × 高さ × コマ数は6,000万画素までです。超えると保存ボタンが押せなくなり、収まる長辺が表示されます。
- 1コマの時間は0.02~10秒です。繰り返しは「ずっと」と「1回」から選べます。「1回」は繰り返しの印を入れないGIFで、ChromeとEdgeが使うSkiaのデコーダーはこれを繰り返し0回、つまり1回だけの再生として読みます。
- 音と動画は入れられません。長くて動きの多い場面は、GIFより動画ファイルのほうがずっと小さくなるため、動画からGIFが必要なときは動画GIF変換ツールを使います。
- すべての処理をブラウザーのメモリー内で行うため、古いスマートフォンでは、大きなGIFの作成に時間がかかったり止まったりすることがあります。
基準日: 2026-10-23に、下記の資料の該当する文を確認しました。容量の数字は、Chromeでこのツールを使って例の写真を実際に作って測った値です。ブラウザーによって写真の縮小方法が少し違うため、数KBの差が出ることがあります。
出典
- 01W3C — Graphics Interchange Format Version 89a遅延時間(1/100秒)、色の表のサイズ(最大256)、透明色の番号、処理方法
- 02WebKit — ScalableImageDecoder.cpp0.01秒(10 ms)以下と記録されたコマを、Firefoxと同じく0.1秒で表示するというコメント
- 03Skia — SkCodec.h, getRepetitionCount繰り返し回数に最初の再生は含まれず、0なら1回だけ再生される動く画像
- 04Heckbert, P. (1982). Color image quantization for frame buffer display. SIGGRAPH '82, 297–307メディアンカットによる減色
- 05GitHub Docs — Attaching files画像とGIFは10MBまで
- 06web.dev — Replace animated GIFs with video for faster page loads長いGIFアニメーションを動画に置き換えると大きく小さくなる
- 07Wikimedia Commons — 例の写真4枚(CC0 1.0)corina ardeleanu 'Red poppies under morning sun', Fritz Bielmeier 'Riding a bike in the park', Alisa Anton 'Coffee shop entrance in Leiden', Charlie Hang 'Sunset over beach'
よくある質問
写真は何枚まで入れられますか?
コマは300まで、ファイルは1つあたり50MBまで入れられます。ただし、作成するGIFの幅 × 高さ × コマ数が6,000万画素を超えると保存できません。そのときは、収まる長辺が表示されます。
コマごとに時間を変えられますか?
はい。フィルムの帯でマスの右端をドラッグするか、マスを選んで「このコマの時間」欄に0.02~10秒を入力します。GIFは時間を1/100秒単位で記録するので、0.01秒単位まで指定できます。
0.01秒のようにごく短くすると、もっと速くなりますか?
いいえ。0.01秒以下と記録されたGIFは、SafariとFirefoxが0.1秒に遅くして表示します。そのためこのツールでは、1コマに0.02秒から入れられるようにしています。
容量が思ったより大きくなるのはなぜですか?
写真はコマごとにほとんどの画素が変わるため、コマ数に比例して大きくなります。例の写真4枚は長辺480pxで約367KBですが、なめらかな切り替えをオンにするとコマ数が20になり、約1.96MBになります。長辺を小さくするか「即時」を選ぶと小さくなります。
すでにあるGIFの速さを変えたり、逆再生にしたりできますか?
はい。GIFを入れるとコマに展開されます。「2倍速く」「2倍遅く」でリズムを保ったまま速さを変えられ、順序で「逆再生」や「往復」も選べます。いらないコマは削除できます。
背景が透明なGIFも作れますか?
背景を「透明」にすれば作れます。GIFの透明はオンとオフの2通りしかないため、半透明の縁は、半分以上不透明なら色に、それより薄ければ透明に変わり、少しざらついて見えることがあります。
iPhoneの写真(HEIC)も入れられますか?
ブラウザーがHEICを読み込める場合だけ入ります。読み込めないときは案内が表示されるので、HEICをJPGに変換してから入れてください。
写真はサーバーにアップロードされますか?
いいえ。写真の読み込みもGIFの作成も、すべていま使っているブラウザーの中で行います。保存ボタンを押すと、作ったファイルがそのままダウンロードされます。