GIF โปร่งใสที่เล็กที่สุดมีขนาด 43 ไบต์
นี่คือทั้งหมดของมัน เลือกไบต์ใดก็ได้เพื่อดูว่ามันทำหน้าที่อะไร จากนั้นคัดลอกไฟล์ ดาวน์โหลด ฮอตลิงก์ หรือเสิร์ฟจากโค้ดของคุณเอง

R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==
แต่ละไบต์ทำหน้าที่อะไร
GIF คือลำดับของบล็อก ไฟล์นี้มีเจ็ดบล็อก และทุกสีบนหน้านี้เป็นของบล็อกใดบล็อกหนึ่ง เลือกไบต์หรือบล็อกเพื่ออ่านคำอธิบาย ตัวเลขจัดเก็บแบบ little-endian: ไบต์ต่ำมาก่อน ดังนั้น 01 00 จึงหมายถึง 1
| ไบต์ | ฟิลด์ | ความหมาย |
|---|---|---|
| ส่วนหัว บอกตัวถอดรหัสว่านี่คือ GIF และเป็นรูปแบบเวอร์ชันใด | ||
| 47 49 46 | ลายเซ็น | ตัวอักษร ASCII “GIF” ไฟล์ GIF ทุกไฟล์ขึ้นต้นด้วยตัวอักษรเหล่านี้ |
| 38 39 61 | เวอร์ชัน | “89a” ต้องใช้ 89a จึงจะโปร่งใสได้ ส่วน 87a ไม่มีส่วนขยายควบคุมกราฟิก |
| ตัวอธิบายหน้าจอเชิงตรรกะ ขนาดของแคนวาสและวิธีตั้งค่าตารางสี | ||
| 01 00 | ความกว้างแคนวาส | 1 พิกเซล |
| 01 00 | ความสูงแคนวาส | 1 พิกเซล |
| 80 | แฟล็กแบบแพ็ก | การตั้งค่าสี่อย่างอัดรวมอยู่ในไบต์เดียว บิตบนสุดบอกว่ามีตารางสีส่วนกลางตามมา ส่วนสามบิตล่างสุดบอกขนาดของตาราง |
| 00 | ดัชนีสีพื้นหลัง | รายการที่ 0 ของพาเลต เบราว์เซอร์จะไม่สนใจค่านี้และแสดงสิ่งที่อยู่ด้านหลังภาพแทน |
| 00 | อัตราส่วนพิกเซล | 0 หมายถึงพิกเซลสี่เหลี่ยมจัตุรัส ไม่มีการปรับแก้ |
| ตารางสีส่วนกลาง พาเลตสี พิกเซลจะเก็บดัชนีที่ชี้ไปยังรายการนี้แทนการเก็บสี | ||
| FF FF FF | รายการในพาเลต | แดง เขียว และน้ำเงิน อย่างละหนึ่งไบต์: #ffffff ตารางสีของ GIF มีได้เล็กสุดสองรายการ |
| 00 00 00 | รายการในพาเลต | แดง เขียว และน้ำเงิน อย่างละหนึ่งไบต์: #000000 ตารางสีของ GIF มีได้เล็กสุดสองรายการ |
| ส่วนขยายควบคุมกราฟิก บล็อกเสริมที่เพิ่มเข้ามาใน GIF89a ในที่นี้ใช้ทำให้รายการที่ 0 ของพาเลตโปร่งใส | ||
| 21 | ตัวนำส่วนขยาย | 0x21 (“!”) ประกาศว่าต่อไปเป็นบล็อกส่วนขยาย |
| F9 | ป้ายควบคุมกราฟิก | 0xF9 บอกว่าส่วนขยายนี้คือส่วนขยายควบคุมกราฟิก |
| 04 | ขนาดบล็อก | ตามด้วยการตั้งค่า 4 ไบต์ |
| 01 | แฟล็กแบบแพ็ก | บิตต่ำสุดคือแฟล็กความโปร่งใส ซึ่งเปิดอยู่ จึงใช้ดัชนีสีโปร่งใสด้านล่าง |
| 00 00 | หน่วงเวลา | 0 ในร้อยวินาที มีผลเฉพาะกับภาพเคลื่อนไหว |
| 00 | ดัชนีสีโปร่งใส | รายการที่ 0 ของพาเลตจะถูกวาดให้โปร่งใสทั้งหมด |
| 00 | ตัวปิดบล็อก | บล็อกย่อยความยาวศูนย์ที่ใช้ปิดบล็อก |
| ตัวอธิบายภาพ ตำแหน่งของภาพบนแคนวาสและขนาดของภาพ | ||
| 2C | ตัวคั่นภาพ | 0x2C (“,”) เริ่มต้นภาพ |
| 00 00 | ซ้าย | ภาพเริ่มห่างจากขอบซ้ายของแคนวาส 0 พิกเซล |
| 00 00 | บน | ภาพเริ่มห่างจากขอบบนของแคนวาส 0 พิกเซล |
| 01 00 | ความกว้างภาพ | 1 พิกเซล |
| 01 00 | ความสูงภาพ | 1 พิกเซล |
| 00 | แฟล็กแบบแพ็ก | ไม่มีตารางสีเฉพาะที่ ไม่ใช่แบบอินเทอร์เลซ ภาพใช้พาเลตส่วนกลาง |
| ข้อมูลภาพ พิกเซลที่บีบอัดด้วย LZW และแบ่งเป็นบล็อกย่อยขนาดไม่เกิน 255 ไบต์ | ||
| 02 | ขนาดโค้ดขั้นต่ำของ LZW | 2 ดังนั้นโค้ดที่บีบอัดจะเริ่มต้นที่ความกว้าง 3 บิต |
| 02 | ขนาดบล็อกย่อย | ตามด้วยข้อมูลที่บีบอัด 2 ไบต์ |
| 44 01 | พิกเซลที่บีบอัด | โค้ด LZW ที่แพ็กเรียงจากบิตต่ำสุดขึ้นไป ดูวิธีถอดรหัสได้ด้านล่าง |
| 00 | ตัวปิดบล็อก | บล็อกย่อยความยาวศูนย์ที่ใช้ปิดบล็อก |
| ส่วนท้าย ไบต์เดียวที่ระบุจุดสิ้นสุดของไฟล์ | ||
| 3B | ส่วนท้าย | 0x3B (“;”) ปิดท้ายไฟล์ |
ภายในไบต์แบบแพ็ก
สามไบต์นี้แต่ละไบต์เก็บการตั้งค่าเล็กๆ หลายอย่าง บิต 7 อยู่ซ้ายสุด
0x800x010x00สองไบต์เก็บหนึ่งพิกเซลได้อย่างไร
เมื่อขนาดโค้ดขั้นต่ำเป็น 2 ตัวถอดรหัสจะอ่านโค้ดขนาด 3 บิต โค้ด 4 ล้างตาราง โค้ด 5 จบภาพ และโค้ด 0 ถึง 3 คือรายการในพาเลต ไบต์ 44 01 อ่านจากบิตต่ำสุดขึ้นไป:
0x44 010001000x01 00000001
- 001100 = 4ล้าง: เริ่มด้วยตารางใหม่
- 000000 = 0พิกเซล: รายการที่ 0 ของพาเลต
- 101101 = 5จบภาพ
- 0000000 บิตเติมที่ไม่ได้ใช้
ภาพที่ใหญ่กว่าก็ใช้วิธีเดียวกัน โค้ดใหม่แต่ละตัวแทนช่วงพิกเซลที่ยาวกว่าตัวก่อนหน้าหนึ่งพิกเซล GIF โปร่งใสขนาด 1000×1000 จึงใช้เพียง 1,743 ไบต์
เล็กกว่านี้ได้ไหม?
ได้ ถ้าตัดส่วนที่ตัวถอดรหัสยอมให้ขาดได้ออกไป เราส่งแต่ละแบบให้เอนจินเบราว์เซอร์สามตัวและ Pillow แล้วบันทึกว่าแต่ละตัววาดอะไรออกมา
| ขนาด | แบบ | Chromium | Firefox | WebKit | Pillow |
|---|---|---|---|---|---|
| 43 | ไฟล์มาตรฐานบนหน้านี้ | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 42 | ไม่มีไบต์ส่วนท้าย อย่างไรก็ตามตัวถอดรหัสจะหยุดเมื่อถึงท้ายข้อมูลอยู่แล้ว | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 37 | ไม่มีพาเลตเลย แต่ยังถูกต้อง: สเปกอนุญาตให้ตัวถอดรหัสใช้พาเลตของตัวเอง และดัชนี 0 ก็โปร่งใสอยู่แล้ว | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 36 | ไม่มีพาเลตและไม่มีส่วนท้าย | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 35 | ไม่มีบล็อกความโปร่งใส: พิกเซลจะถูกวาดด้วยสีที่ 0 ของพาเลต คือสีขาว | ขาว | ขาว | ขาว | ขาว |
| 35 | รูปแบบปี 1987 ไม่มีวิธีกำหนดให้สีใดโปร่งใส | ขาว | ขาว | ขาว | ขาว |
| 34 | มีบล็อกความโปร่งใส แต่ไม่มีพิกเซลที่บีบอัด | โปร่งใส | โปร่งใส | โปร่งใส | ข้อผิดพลาด |
| 33 | เหมือนข้างบน แต่ไม่มีส่วนท้าย | โปร่งใส | โปร่งใส | โปร่งใส | ข้อผิดพลาด |
| 29 | ไม่มีพาเลตและไม่มีความโปร่งใส แต่ละเอนจินเลือกสีเอง | ดำ | ขาว | โปร่งใส | ดำ |
| 26 | ภาพที่ไม่มีข้อมูลบีบอัดเลย | โปร่งใส | โปร่งใส | โปร่งใส | ข้อผิดพลาด |
| 14 | มีเพียงส่วนหัว ขนาดแคนวาส และส่วนท้าย ไม่มีภาพอยู่ข้างใน | โปร่งใส | ข้อผิดพลาด | โปร่งใส | ข้อผิดพลาด |
ใช้ 43 ไบต์เมื่อต้องทำงานได้ทุกที่ 37 ไบต์ยังเป็น GIF ที่ถูกต้องและโปร่งใสในทุกเอนจินที่เราทดสอบ ถ้าเล็กกว่านั้นจะต้องพึ่งความยืดหยุ่นของตัวถอดรหัส และไฟล์ 29 ไบต์ก็แสดงให้เห็นว่าแต่ละเอนจินให้ผลต่างกัน
ตรวจสอบเมื่อ 23 กันยายน 2569 ด้วย Chromium 153.0.8010.12, Firefox 155.0, WebKit 26.6, Pillow 12.2.0
พิกเซลเดียวกันในรูปแบบอื่น
ไฟล์ 1×1 โปร่งใสที่เล็กที่สุดที่เราสร้างได้ในแต่ละรูปแบบ ส่งให้เอนจินสี่ตัวเดิม เปิดแถวเพื่อดูไบต์ของไฟล์ ซึ่งระบายสีเหมือนบล็อก GIF ที่ทำหน้าที่เดียวกัน
| ขนาด | ไฟล์ | data URI | Chromium | Firefox | WebKit | Pillow |
|---|---|---|---|---|---|---|
| 28 | WebP เหมือนข้างบน แต่ไม่มีไบต์ส่วนเติมสองไบต์ WebKit ปฏิเสธไฟล์ WebP ที่สั้นกว่า 30 ไบต์52 49 46 46 14 00 00 00 57 45 42 50 56 50 38 4c 08 00 00 00 2f 00 00 00 10 88 88 08
| 63 | โปร่งใส | โปร่งใส | ข้อผิดพลาด | โปร่งใส |
| 30 | WebP VP8L แบบไม่สูญเสียคุณภาพ ทุกรหัสนำหน้ามีสัญลักษณ์เดียว พิกเซลจึงไม่ใช้บิตเลย และไฟล์มีขนาดเท่าเดิมไปจนถึง 16384×1638452 49 46 46 16 00 00 00 57 45 42 50 56 50 38 4c 0a 00 00 00 2f 00 00 00 10 88 88 08 00 00
| 63 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 43 | GIF GIF 43 ไบต์จากด้านบนของหน้านี้47 49 46 38 39 61 01 00 01 00 80 00 00 ff ff ff 00 00 00 21 f9 04 01 00 00 00 00 2c 00 00 00 00 01 00 01 00 00 02 02 44 01 00 3b
| 82 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 58 | BMP เฮดเดอร์ 40 ไบต์แบบดั้งเดิมไม่มีมาสก์อัลฟา ไบต์ที่สี่จึงถูกละเลย และพิกเซลเป็นสีดำในทุกเอนจิน42 4d 3a 00 00 00 00 00 00 00 36 00 00 00 28 00 00 00 01 00 00 00 01 00 00 00 01 00 20 00 00 00 00 00 04 00 00 00 13 0b 00 00 13 0b 00 00 00 00 00 00 00 00 00 00 00 00 00 00
| 102 | ดำ | ดำ | ดำ | ดำ |
| 62 | SVG อิลิเมนต์ | 85 | โปร่งใส | โปร่งใส | โปร่งใส | ข้อผิดพลาด |
| 67 | PNG ทรูคัลเลอร์พร้อมอัลฟา สแกนไลน์เดียวที่เป็นศูนย์ทั้งหมดถูกบีบอัดด้วยมือ สั้นกว่า zlib ที่ตั้งค่าดีที่สุดหนึ่งไบต์89 50 4e 47 0d 0a 1a 0a 00 00 00 0d 49 48 44 52 00 00 00 01 00 00 00 01 08 06 00 00 00 1f 15 c4 89 00 00 00 0a 49 44 41 54 78 01 63 00 01 00 00 05 00 01 36 d0 88 dd 00 00 00 00 49 45 4e 44 ae 42 60 82
| 114 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 70 | ICO ไอคอนเว็บ (favicon) ที่บรรจุบิตแมป 32 บิตและ AND mask 1 บิต00 00 01 00 01 00 01 01 00 00 01 00 20 00 30 00 00 00 16 00 00 00 28 00 00 00 01 00 00 00 02 00 00 00 01 00 20 00 00 00 00 00 08 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 80 00 00 00
| 121 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 74 | BMP เฮดเดอร์ 56 ไบต์ที่มีมาสก์อัลฟา WebKit โหลดไม่ได้42 4d 4a 00 00 00 00 00 00 00 46 00 00 00 38 00 00 00 01 00 00 00 01 00 00 00 01 00 20 00 03 00 00 00 04 00 00 00 13 0b 00 00 13 0b 00 00 00 00 00 00 00 00 00 00 00 00 ff 00 00 ff 00 00 ff 00 00 00 00 00 00 ff 00 00 00 00
| 122 | โปร่งใส | โปร่งใส | ข้อผิดพลาด | โปร่งใส |
| 89 | ICO ไอคอนเว็บ (favicon) ที่บรรจุ PNG 67 ไบต์00 00 01 00 01 00 01 01 00 00 01 00 20 00 43 00 00 00 16 00 00 00 89 50 4e 47 0d 0a 1a 0a 00 00 00 0d 49 48 44 52 00 00 00 01 00 00 00 01 08 06 00 00 00 1f 15 c4 89 00 00 00 0a 49 44 41 54 78 01 63 00 01 00 00 05 00 01 36 d0 88 dd 00 00 00 00 49 45 4e 44 ae 42 60 82
| 145 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 126 | BMP เฮดเดอร์ V4 WebKit ละเลยมาสก์อัลฟาและวาดเป็นสีดำ42 4d 7e 00 00 00 00 00 00 00 7a 00 00 00 6c 00 00 00 01 00 00 00 01 00 00 00 01 00 20 00 03 00 00 00 04 00 00 00 13 0b 00 00 13 0b 00 00 00 00 00 00 00 00 00 00 00 00 ff 00 00 ff 00 00 ff 00 00 00 00 00 00 ff 42 47 52 73 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00
| 190 | โปร่งใส | โปร่งใส | ดำ | โปร่งใส |
| 142 | BMP เฮดเดอร์ V5 ได้ผลเหมือนกันใน WebKit42 4d 8e 00 00 00 00 00 00 00 8a 00 00 00 7c 00 00 00 01 00 00 00 01 00 00 00 01 00 20 00 03 00 00 00 04 00 00 00 13 0b 00 00 13 0b 00 00 00 00 00 00 00 00 00 00 00 00 ff 00 00 ff 00 00 ff 00 00 00 00 00 00 ff 42 47 52 73 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00
| 214 | โปร่งใส | โปร่งใส | ดำ | โปร่งใส |
| 437 | AVIF เหมือนข้างบน แต่ใช้การสุ่มสี 4:0:0 ซึ่งตัดระนาบสีออก00 00 00 1c 66 74 79 70 61 76 69 66 00 00 00 00 61 76 69 66 6d 69 66 31 6d 69 61 66 00 00 01 6a 6d 65 74 61 00 00 00 00 00 00 00 21 68 64 6c 72 00 00 00 00 00 00 00 00 70 69 63 74 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 0e 70 69 74 6d 00 00 00 00 00 01 00 00 00 2c 69 6c 6f 63 00 00 00 00 44 00 00 02 00 01 00 00 00 01 00 00 01 a0 00 00 00 15 00 02 00 00 00 01 00 00 01 8e 00 00 00 12 00 00 00 42 69 69 6e 66 00 00 00 00 00 02 00 00 00 1a 69 6e 66 65 02 00 00 00 00 01 00 00 61 76 30 31 43 6f 6c 6f 72 00 00 00 00 1a 69 6e 66 65 02 00 00 00 00 02 00 00 61 76 30 31 41 6c 70 68 61 00 00 00 00 1a 69 72 65 66 00 00 00 00 00 00 00 0e 61 75 78 6c 00 02 00 01 00 01 00 00 00 a7 69 70 72 70 00 00 00 81 69 70 63 6f 00 00 00 14 69 73 70 65 00 00 00 00 00 00 00 01 00 00 00 01 00 00 00 0e 70 69 78 69 00 00 00 00 01 08 00 00 00 0c 61 76 31 43 81 00 1c 00 00 00 00 13 63 6f 6c 72 6e 63 6c 78 00 01 00 0d 00 06 80 00 00 00 38 61 75 78 43 00 00 00 00 75 72 6e 3a 6d 70 65 67 3a 6d 70 65 67 42 3a 63 69 63 70 3a 73 79 73 74 65 6d 73 3a 61 75 78 69 6c 69 61 72 79 3a 61 6c 70 68 61 00 00 00 00 1e 69 70 6d 61 00 00 00 00 00 00 00 02 00 01 04 01 02 83 04 00 02 04 01 02 83 05 00 00 00 2f 6d 64 61 74 12 00 0a 04 18 00 06 15 32 08 10 00 00 18 e1 42 72 10 12 00 0a 07 18 00 06 18 08 68 35 32 08 10 00 00 18 e1 42 72 10
| 607 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
| 471 | AVIF สิ่งที่ libavif เขียนออกมาที่ quality 100: ภาพ AV1 หนึ่งภาพสำหรับสีและอีกหนึ่งภาพสำหรับอัลฟา อยู่ในกล่อง ISO BMFF00 00 00 20 66 74 79 70 61 76 69 66 00 00 00 00 61 76 69 66 6d 69 66 31 6d 69 61 66 4d 41 31 42 00 00 01 86 6d 65 74 61 00 00 00 00 00 00 00 21 68 64 6c 72 00 00 00 00 00 00 00 00 70 69 63 74 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 00 0e 70 69 74 6d 00 00 00 00 00 01 00 00 00 2c 69 6c 6f 63 00 00 00 00 44 00 00 02 00 01 00 00 00 01 00 00 01 c0 00 00 00 17 00 02 00 00 00 01 00 00 01 ae 00 00 00 12 00 00 00 42 69 69 6e 66 00 00 00 00 00 02 00 00 00 1a 69 6e 66 65 02 00 00 00 00 01 00 00 61 76 30 31 43 6f 6c 6f 72 00 00 00 00 1a 69 6e 66 65 02 00 00 00 00 02 00 00 61 76 30 31 41 6c 70 68 61 00 00 00 00 1a 69 72 65 66 00 00 00 00 00 00 00 0e 61 75 78 6c 00 02 00 01 00 01 00 00 00 c3 69 70 72 70 00 00 00 9d 69 70 63 6f 00 00 00 14 69 73 70 65 00 00 00 00 00 00 00 01 00 00 00 01 00 00 00 10 70 69 78 69 00 00 00 00 03 08 08 08 00 00 00 0c 61 76 31 43 81 00 0c 00 00 00 00 13 63 6f 6c 72 6e 63 6c 78 00 01 00 0d 00 06 80 00 00 00 0e 70 69 78 69 00 00 00 00 01 08 00 00 00 0c 61 76 31 43 81 00 1c 00 00 00 00 38 61 75 78 43 00 00 00 00 75 72 6e 3a 6d 70 65 67 3a 6d 70 65 67 42 3a 63 69 63 70 3a 73 79 73 74 65 6d 73 3a 61 75 78 69 6c 69 61 72 79 3a 61 6c 70 68 61 00 00 00 00 1e 69 70 6d 61 00 00 00 00 00 00 00 02 00 01 04 01 02 83 04 00 02 04 01 05 86 07 00 00 00 31 6d 64 61 74 12 00 0a 04 18 00 06 15 32 08 10 00 00 18 e1 42 72 10 12 00 0a 08 18 00 06 08 08 68 34 20 32 09 10 00 00 00 07 c8 24 c6 62
| 651 | โปร่งใส | โปร่งใส | โปร่งใส | โปร่งใส |
- ลายเซ็น
- ขนาด
- พาเลต
- ความโปร่งใส
- คอนเทนเนอร์
- พิกเซล
- ส่วนท้าย
- เมทาดาทา
- ส่วนเติม
WebP ขนาด 30 ไบต์ เป็นไฟล์ที่เล็กที่สุดที่ออกมาโปร่งใสในเอนจินทั้งสี่ตัว เล็กกว่า GIF 13 ไบต์
ความยาวของ data URI เป็นจำนวนอักขระ: SVG เป็นข้อความที่เข้ารหัสแบบ URL ส่วนที่เหลือเป็น base64 ตรวจสอบเมื่อ 24 กันยายน 2569 ด้วย Chromium 153.0.8010.12, Firefox 155.0, WebKit 26.6, Pillow 12.2.0 AVIF สร้างด้วย libavif 1.4.1
สร้างขนาดใดก็ได้
โปร่งใสหรือสีทึบ ตั้งแต่ 1×1 ถึง 65535×65535 สร้างในเบราว์เซอร์ของคุณ ไม่มีการอัปโหลดใดๆ
ฮอตลิงก์
ลิงก์ไปยังไฟล์เหล่านี้ได้โดยตรงจากเว็บไซต์ อีเมล หรือแอปใดก็ได้ ไฟล์เสิร์ฟจาก edge ของ Cloudflare โดยแคชได้นาน และเปิด CORS ให้ทุกคน
- ไฟล์ 43 ไบต์
https://emptygif.com/1x1.gif - ขนาดใดก็ได้ โปร่งใส
https://emptygif.com/px/300x250.gif - ขนาดใดก็ได้ สีทึบ
https://emptygif.com/px/300x250/ff5a1f.gif - ใช้ได้เหมือนกันกับ PNG, WebP หรือ SVG
https://emptygif.com/px/300x250.webp - JSON API: ขนาด, base64 และ data URI
https://emptygif.com/api/gif?w=300&h=250 - ตัวอย่างโค้ดทั้งหมดในรูปแบบ JSON
https://emptygif.com/snippets.json - สรุปสำหรับเอเจนต์ AI
https://emptygif.com/llms.txt
เฮดเดอร์ของการตอบกลับ
HTTP/2 200
content-type: image/gif
content-length: 43
cache-control: public, max-age=31536000, immutable
access-control-allow-origin: *
cross-origin-resource-policy: cross-origin
timing-allow-origin: *ตัวอย่าง
<img src="https://emptygif.com/1x1.gif" width="1" height="1" alt="">
ขนาดที่สร้างได้สูงสุด 4096 พิกเซลต่อด้าน หากมีทราฟฟิกสูง โปรดดาวน์โหลดไฟล์ไปโฮสต์เอง
เสิร์ฟจากสแตกของคุณ
ตัวอย่างโค้ดพร้อมรัน 191 ชุด เลือกแบบที่คุณใช้ ทุกชุดตอบกลับด้วย image/gif ที่พาธที่คุณเลือก ถ้าคุณเปลี่ยนขนาดหรือสีไว้ด้านบน ตัวอย่างโค้ดจะใช้ GIF นั้น
JavaScript & TypeScript
- Next.js (App Router)
- Hono
- Bun.serve
- Elysia
- Deno.serve
- SvelteKit
- Nuxt (Nitro server route)
- Astro
- React Router (framework mode, ex-Remix)
- TanStack Start
- SolidStart
- Hono on Bun
- Hono on Deno
- srvx (universal fetch server)
- Qwik City
- RedwoodSDK
- Angular SSR (Express server.ts)
- Fresh
- Oak
- Encore.ts
- NestJS
- Fastify
- Express
- Node.js standard library (node:http)
- Koa
- hapi
- AdonisJS
Edge & serverless
- Cloudflare Workers
- Cloudflare Workers (Rust, workers-rs)
- Cloudflare Pages Functions
- Spin (Rust, WASI HTTP component)
- Deno Deploy (deno serve)
- Vercel Functions
- Netlify Functions
- Netlify Edge Functions
- AWS Lambda (Node.js)
- AWS Lambda (Python)
- AWS Lambda (Go)
- AWS Lambda (Rust, lambda_http)
- AWS Lambda@Edge (CloudFront)
- Google Cloud Run functions (Node.js)
- Google Cloud Run functions (Python)
- Firebase Cloud Functions + Hosting
- Azure Functions (Node.js v4 model)
- Fastly Compute (JavaScript)
Python
Go
JVM
PHP
Elixir, Erlang & Gleam
Functional languages
C, C++ & systems languages
Swift, Dart & other languages
Web servers & proxies
Command line & one-liners
Express JavaScript
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);
เรารันตัวอย่างโค้ดนี้และเทียบไบต์ที่ได้กลับมาแล้ว เปิดหน้า
ใช้ทำอะไร
- พิกเซลติดตามและบีคอน: เซิร์ฟเวอร์บันทึกคำขอ แล้วตอบกลับด้วยภาพที่ถูกต้องซึ่งเล็กที่สุด
- ตัวยึดตำแหน่งสำหรับภาพแบบ lazy-load เพื่อให้แท็ก
imgถูกต้องก่อนที่ซอร์สภาพจริงจะมาถึง - ตัวเว้นระยะขนาดคงที่ในอีเมล HTML ซึ่งรองรับ CSS ได้ไม่สม่ำเสมอ
- การทดสอบและ mock ที่ต้องการภาพจริงโดยไม่ต้องแนบไฟล์ภาพไปด้วย
พิกเซลติดตามเชื่อถือได้น้อยกว่าที่เห็น
เมื่อเปิดการป้องกันความเป็นส่วนตัวของเมล Apple Mail จะโหลดภาพระยะไกลล่วงหน้าผ่านพร็อกซี ดังนั้น “การเปิดอ่าน” อาจไม่ใช่คนจริงเลย Gmail ก็ดึงภาพผ่านพร็อกซีของตัวเองและแคชไว้ ไคลเอนต์จำนวนมากบล็อกภาพระยะไกลเป็นค่าเริ่มต้น สำหรับการวิเคราะห์หน้าเว็บ navigator.sendBeacon() หรือการตอบกลับ 204 No Content มักเหมาะกว่าภาพ
คำถาม
- ทำไมถึงเรียกว่าว่างเปล่า ทั้งที่มีพิกเซลอยู่?
- GIF ต้องมีอย่างน้อยหนึ่งพิกเซล ไฟล์นี้มีขนาด 1×1 และสีเดียวของมันถูกกำหนดให้โปร่งใส จึงไม่มีอะไรแสดงออกมา
- ไฟล์ 43 ไบต์นี้ถูกต้องตามสเปกไหม?
- ถูกต้อง เป็นไปตามสเปก GIF89a ทุกประการ และทุกเอนจินในตารางด้านบนวาดออกมาโปร่งใส
- ทำไมใช้ GIF ไม่ใช่ PNG หรือ WebP?
- เพราะเล็กกว่า PNG โปร่งใสขนาดเล็กสุด และทุกเบราว์เซอร์ ไคลเอนต์อีเมล และไลบรารีภาพในช่วง 35 ปีที่ผ่านมาอ่านได้
- ควรใช้ data URI หรือไฟล์?
- data URI ช่วยประหยัดคำขอหนึ่งครั้ง เหมาะกับตัวยึดตำแหน่งและ CSS ส่วนไฟล์หรือ endpoint จำเป็นเมื่อตัวคำขอเองคือเป้าหมาย เช่น พิกเซลติดตาม
- ควรส่ง Content-Type อะไร?
image/gifและเพิ่มCache-Control: no-storeหากทุกคำขอต้องไปถึงเซิร์ฟเวอร์ของคุณ