tigtools

แปลงรูปภาพเป็น Base64

แปลงไฟล์ PNG, JPEG, WebP, GIF, SVG หรือ ICO เป็นข้อความ Base64 เพื่อฝังใน HTML, CSS หรือ JSON หรือถอดรหัส Base64 กลับเป็นรูปภาพ ไฟล์จะไม่ออกจากเบราว์เซอร์ของคุณ

ทำงานในเบราว์เซอร์ของคุณ ไม่ต้องสมัคร

ทิศทางการแปลง

หรือลากไฟล์มาวางที่นี่ (สูงสุด 10 MB) ไฟล์จะอยู่ในอุปกรณ์ของคุณ

วิธีใช้งาน

  1. เลือก รูปภาพ → Base64 แล้วเลือกไฟล์รูปภาพ หรือเลือก Base64 → รูปภาพ เพื่อแปลงกลับ
  2. เลือกรูปแบบผลลัพธ์ที่ต้องการ: Data URL, Base64 ปกติ, แท็ก img ของ HTML, กฎ background-image ของ CSS หรือ Markdown
  3. คัดลอกผลลัพธ์แล้ววางลงในโค้ด เทมเพลตอีเมล หรือ JSON
  4. เมื่อต้องการถอดรหัส ให้วาง Data URL หรือ Base64 ปกติ ระบบจะแสดงภาพตัวอย่างและให้ดาวน์โหลดได้

วิธีการทำงาน

Base64 ใช้อักขระที่พิมพ์ได้ 64 ตัวแทนข้อมูลไบนารี จึงสามารถเขียนข้อมูลรูปภาพไว้ในรูปแบบข้อความได้โดยตรง Data URL จะเพิ่มชนิดสื่อไว้ข้างหน้า เช่น data:image/png;base64, ตามด้วยไบต์ที่เข้ารหัสแล้ว เบราว์เซอร์รองรับ Data URL ในทุกตำแหน่งที่ใช้ URL ของรูปภาพได้ เช่น ค่า src ของแท็ก img, url() ใน CSS หรือการอ้างอิงรูปภาพใน SVG

ข้อความที่เข้ารหัสแล้วจะมีขนาดใหญ่กว่าไฟล์ต้นฉบับประมาณหนึ่งในสามเสมอ (ใช้ 4 อักขระต่อข้อมูล 3 ไบต์) การฝังไอคอนขนาดเล็กและภาพแทนชั่วคราวช่วยลดการเรียกเครือข่ายแยกต่างหากได้ แต่ข้อมูลที่ฝังไว้จะไม่สามารถแคชแยกได้ และต้องดาวน์โหลดใหม่ทุกครั้งที่โหลดหน้าเว็บหรือสไตล์ชีตที่มีข้อมูลนั้น จึงมักไม่คุ้มเมื่อมีขนาดเกินไม่กี่กิโลไบต์ โปรแกรมอ่านอีเมลหลายตัวบล็อกหรือลบรูปภาพ Data URL จึงควรทดสอบก่อนใช้ในจดหมายข่าว

ระบบเข้ารหัสไฟล์ทีละไบต์โดยไม่มีการบีบอัดซ้ำ และเก็บข้อมูลเมตาที่อยู่ในไฟล์ไว้ (เช่น EXIF) เมื่อต้องการถอดรหัส เครื่องมือนี้รองรับ Data URL แบบเต็ม, Base64 ปกติ, Base64 แบบปลอดภัยต่อ URL และข้อความที่คัดลอกมาพร้อมตัวครอบ CSS url(…) ระบบจะตรวจหาชนิดรูปภาพจากไบต์ที่ถอดรหัสแล้ว แทนที่จะเชื่อค่าที่ระบุไว้

ตัวอย่าง

ไอคอนขนาดเล็กในสไตล์ชีต

ไอคอน PNG ขนาด 600 ไบต์จะกลายเป็นสตริง Base64 ความยาว 800 อักขระ เลือกผลลัพธ์แบบ CSS เพื่อรับกฎ background-image ที่นำไปวางในคลาสได้โดยไม่ต้องโฮสต์ไฟล์แยก

รูปภาพจากการตอบกลับของ API

API ส่งคืนฟิลด์ JSON เช่น "iVBORw0KGgoAAAANSUhEUg…" วางข้อความใน Base64 → รูปภาพ เพื่อดูภาพ ตรวจสอบขนาด และดาวน์โหลดเป็น PNG

โลโก้ SVG ใน HTML

การเข้ารหัส SVG จะได้ URL data:image/svg+xml;base64 ที่ใช้กับแท็ก img ได้ สำหรับ SVG มาร์กอัป SVG ที่ไม่บีบอัดมักสั้นกว่า Base64 จึงควรพิจารณาฝัง SVG โดยตรง

คำถามที่พบบ่อย

ทำไมไฟล์ Base64 จึงมีขนาดใหญ่กว่ารูปภาพของฉัน

Base64 ใช้อักขระข้อความ 4 ตัวเพื่อเก็บข้อมูล 3 ไบต์ จึงมีขนาดเพิ่มขึ้นประมาณ 33% และเพิ่มอีกเล็กน้อยจากส่วนขึ้นต้นของ Data URL การบีบอัด Gzip หรือ Brotli บนเว็บเซิร์ฟเวอร์ช่วยลดส่วนต่างได้ แต่ไม่ทำให้หายไปทั้งหมด

การเข้ารหัสทำให้รูปภาพเปลี่ยนแปลงหรือถูกบีบอัดหรือไม่

ไม่เปลี่ยน ระบบเข้ารหัสไบต์ของไฟล์ตามเดิมทุกประการ รวมถึงข้อมูลเมตาด้วย หากต้องการให้ข้อความสั้นลง ให้บีบอัดหรือปรับขนาดรูปภาพก่อน

Data URL ต่างจาก Base64 ปกติอย่างไร

Base64 ปกติคือไบต์ที่เข้ารหัสแล้ว ส่วน Data URL จะเพิ่มส่วนขึ้นต้น เช่น data:image/jpeg;base64, เพื่อบอกเบราว์เซอร์ว่าเป็นไฟล์ชนิดใด จึงนำไปใช้เป็นแหล่งที่มาของรูปภาพได้โดยตรง

มีขีดจำกัดขนาดไฟล์หรือไม่

เข้ารหัสไฟล์ได้สูงสุด 10 MB สตริงที่ยาวมากอาจทำให้ช่องข้อความและโปรแกรมแก้ไขทำงานช้าลง และ Data URL ขนาดใหญ่ระดับนั้นก็ไม่เหมาะกับการใช้งานบนเว็บไซต์

ความเป็นส่วนตัว

การเข้ารหัสและถอดรหัสทำงานในเบราว์เซอร์ของคุณ รูปภาพและข้อความ Base64 จะไม่ถูกอัปโหลด จัดเก็บ หรือนำไปรวมในข้อมูลวิเคราะห์