emptygif
言語: 日本語

最小の透明 GIF は 43 バイトです。

これで全部です。バイトを選ぶとその役割が表示されます。ファイルをコピー、ダウンロード、直リンクしたり、自分のコードから配信したりできます。

43 バイトの GIF を拡大表示:透明なピクセルが 1 つ
0000
0010
0020
1×1.gif をダウンロード

R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==

各バイトの役割

GIF はブロックの並びでできています。このファイルには 7 つのブロックがあり、このページの色はそれぞれどれかのブロックに対応しています。バイトやブロックを選ぶと説明が表示されます。 数値はリトルエンディアンで格納されます。下位バイトが先に来るので、01 00 は 1 を表します。

バイトフィールド意味
ヘッダー これが GIF であることと、どのバージョンの形式かをデコーダーに伝えます。
47 49 46シグネチャASCII 文字の「GIF」。すべての GIF ファイルはこれで始まります。
38 39 61バージョン「89a」。透明にするには 89a が必要です。87a にはグラフィック制御拡張がありません。
論理画面記述子 キャンバスのサイズと、カラーテーブルの構成。
01 00キャンバスの幅1 px。
01 00キャンバスの高さ1 px。
80パックフラグ4 つの設定を 1 バイトに詰め込んでいます。最上位ビットはグローバルカラーテーブルが続くことを示し、下位 3 ビットがそのサイズを表します。
00背景色インデックスパレットの 0 番。ブラウザーはこれを無視し、画像の背後にあるものを表示します。
00ピクセルアスペクト比0 は正方形のピクセルで、補正なしを意味します。
グローバルカラーテーブル パレットです。ピクセルは色そのものではなく、このリストへのインデックスを持ちます。
FF FF FFパレットエントリ赤・緑・青が 1 バイトずつ:#ffffff。GIF のテーブルは最小でも 2 エントリです。
00 00 00パレットエントリ赤・緑・青が 1 バイトずつ:#000000。GIF のテーブルは最小でも 2 エントリです。
グラフィック制御拡張 GIF89a で追加された任意のブロック。ここではパレットの 0 番を透明にしています。
21拡張導入子0x21(「!」)は拡張ブロックの開始を示します。
F9グラフィック制御ラベル0xF9 は、この拡張がグラフィック制御拡張であることを示します。
04ブロックサイズこの後に 4 バイトの設定が続きます。
01パックフラグ最下位ビットが透明フラグです。オンなので、下の透明色インデックスが使われます。
00 00遅延時間0 × 1/100 秒。アニメーションでのみ意味があります。
00透明色インデックスパレットの 0 番は完全に透明として描画されます。
00ブロック終端子ブロックを閉じる長さ 0 のサブブロック。
イメージ記述子 キャンバス上の画像の位置とサイズ。
2Cイメージ区切り子0x2C(「,」)で画像が始まります。
00 00左位置画像はキャンバスの左端から 0 px の位置から始まります。
00 00上位置画像はキャンバスの上端から 0 px の位置から始まります。
01 00画像の幅1 px。
01 00画像の高さ1 px。
00パックフラグローカルカラーテーブルなし、インターレースなし。画像はグローバルパレットを使います。
イメージデータ LZW で圧縮され、最大 255 バイトのサブブロックに分割されたピクセル。
02LZW 最小コードサイズ2。そのため圧縮コードは 3 ビット幅から始まります。
02サブブロックサイズこの後に 2 バイトの圧縮データが続きます。
44 01圧縮ピクセル最下位ビットから詰められた LZW コード。デコードの仕組みは下で説明しています。
00ブロック終端子ブロックを閉じる長さ 0 のサブブロック。
トレーラー ファイルの終わりを示す 1 バイト。
3Bトレーラー0x3B(「;」)でファイルが終わります。

パックされたバイトの中身

3 つのバイトには、それぞれ小さな設定が複数入っています。ビット 7 が一番左です。

論理画面記述子 0x80
1グローバルカラーテーブルあり
000色解像度
0パレットを重要度順にソート
000テーブルサイズ:2^(n+1) エントリ
グラフィック制御拡張 0x01
000予約
000破棄方法
0ユーザー入力を待つ
1透明を有効化
イメージ記述子 0x00
0ローカルカラーテーブルあり
0インターレース
0パレットを重要度順にソート
00予約
000ローカルテーブルサイズ

2 バイトで 1 ピクセルを表す仕組み

最小コードサイズが 2 の場合、デコーダーは 3 ビットのコードを読みます。コード 4 はテーブルをクリアし、コード 5 は画像を終了し、コード 0〜3 はパレットのエントリです。バイト 44 01 は最下位ビットから順に読みます:

0x44 010001000x01 00000001

  1. 001100 = 4クリア:新しいテーブルで開始
  2. 000000 = 0ピクセル:パレットの 0 番
  3. 101101 = 5画像の終わり
  4. 0000000 未使用のパディングビット

大きな画像も同じ仕組みです。新しいコードはそれぞれ直前より 1 ピクセル長い連続を表すので、1000×1000 の透明 GIF でもわずか 1,743 バイトで済みます。

もっと小さくできる?

できます。デコーダーがなくても許容する部分を削れば小さくなります。各バリアントを 3 つのブラウザーエンジンと Pillow に読み込ませ、何が描画されたかを記録しました。

サイズバリアントChromiumFirefoxWebKitPillow
43このページで扱う標準のファイル。透明透明透明透明
42トレーラーバイトなし。デコーダーはいずれにせよデータの終わりで止まります。透明透明透明透明
37パレットなし。それでも仕様上は正しく、デコーダーは独自のパレットを使ってよいことになっており、インデックス 0 はいずれにせよ透明です。透明透明透明透明
36パレットもトレーラーもなし。透明透明透明透明
35透明ブロックなし。ピクセルはパレットの 0 番の色(白)で描画されます。
351987 年の形式。色を透明に指定する手段がありません。
34透明ブロックはあるが、圧縮ピクセルがない。透明透明透明エラー
33上と同じで、トレーラーもなし。透明透明透明エラー
29パレットも透明指定もなし。色は各エンジンがそれぞれ選びます。透明
26圧縮データがまったくない画像。透明透明透明エラー
14ヘッダー、キャンバスサイズ、トレーラーのみ。画像は含まれていません。透明エラー透明エラー

どこでも確実に動く必要があるなら 43 バイトを使いましょう。37 バイトも正しい GIF で、テストしたすべてのエンジンで透明になりました。それより小さいとデコーダーの寛容さ頼みになり、29 バイトのファイルではエンジンごとに結果が分かれます。

2026年9月23日 に Chromium 153.0.8010.12, Firefox 155.0, WebKit 26.6, Pillow 12.2.0 で確認。

任意のサイズで作る

透明または単色で、1×1 から 65535×65535 まで。ブラウザー内で生成するので、何もアップロードされません。

塗り
よく使うサイズ

1×1 · 43 バイト

GIF をダウンロード

自分のスタックから配信する

すぐに動くスニペットが 173 個あります。どれも指定したパスで image/gif のレスポンスを返します。上でサイズや色を変えた場合は、その GIF がスニペットに使われます。

Elixir, Erlang & Gleam

Express JavaScript

インストール
npm i express
ファイル
server.mjs
実行
node server.mjs
import express from 'express';

const GIF = Buffer.from('R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==', 'base64');

const app = express();

app.get('/pixel.gif', (req, res) => {
  res.set('Cache-Control', 'no-store');
  res.type('gif').send(GIF);
});

app.listen(8080);

このスニペットは実行し、返されたバイト列を照合しました。 ページを開く

用途

  • トラッキングピクセルやビーコン:サーバーはリクエストを記録し、最小の有効な画像を返します。
  • 遅延読み込み画像のプレースホルダー。本来の画像ソースが届く前から img タグを有効な状態にできます。
  • CSS のサポートがまちまちな HTML メールでの、固定サイズのスペーサー。
  • 画像ファイルを同梱せずに本物の画像が必要なテストやモック。

トラッキングピクセルは見た目ほど当てになりません

Apple Mail は「メールプライバシー保護」がオンのとき、リモート画像をプロキシ経由で先読みするため、「開封」が人によるものとは限りません。Gmail も独自のプロキシ経由で画像を取得してキャッシュします。多くのクライアントはデフォルトでリモート画像をブロックします。ページのアナリティクスには、画像よりも navigator.sendBeacon()204 No Content レスポンスのほうが適していることがよくあります。

よくある質問

ピクセルがあるのに、なぜ「空」なのですか?
GIF には最低 1 ピクセルが必要です。このファイルは 1×1 で、唯一の色が透明に指定されているため、何も表示されません。
43 バイトのファイルは仕様上正しいですか?
はい。GIF89a 仕様に厳密に従っており、上の表のすべてのエンジンで透明に描画されます。
PNG や WebP ではなく、なぜ GIF なのですか?
最小の透明 PNG よりも小さく、過去 35 年のあらゆるブラウザー、メールクライアント、画像ライブラリで読めるからです。
data URI とファイル、どちらを使うべきですか?
data URI はリクエストを 1 回減らせるので、プレースホルダーや CSS に向いています。トラッキングピクセルのようにリクエストそのものが目的の場合は、ファイルかエンドポイントが必要です。
Content-Type は何を送ればよいですか?
image/gif です。すべてのリクエストをサーバーに届かせる必要がある場合は Cache-Control: no-store も付けてください。