Base64
Image Data URL
⚠️ Large image may freez the browser
ตัวสร้าง URL จากภาพเป็นข้อมูล
แปลงรูปภาพเป็นรูปแบบ Base64 หรือ DataURL โดยใช้ Image to Data URL Generator อัปโหลดรูปภาพของคุณ เลือกแท็บ และรับข้อมูลที่เข้ารหัสเพื่อรวมเข้ากับโครงการ ไฟล์ขนาดใหญ่อาจส่งผลกระทบต่อประสิทธิภาพ พิจารณาขนาดที่เล็กลงเพื่อประสิทธิภาพที่ดีขึ้น เครื่องมือนี้ช่วยให้แทรกรูปภาพลงใน HTML โดยตรงหรือลดการพึ่งพาไฟล์เพื่อการทำงานที่ราบรื่น
Image → Base64 / Data URL
Click or Drag & Drop an Image
แปลงรูปภาพเป็น Data URL
1
อัปโหลดรูปภาพ
อัปโหลดรูปภาพโดยคลิกหรือลากไฟล์เข้าไปในพื้นที่อัปโหลด
2
เลือกรูปแบบ
เลือกแท็บ 'Base64' หรือ 'DataURL' เพื่อเลือกรูปแบบที่คุณต้องการ
3
แสดงข้อมูล URL
การแสดงผลการแทนด้วย Base64 หรือ DataURL ของรูปภาพจะปรากฏในพื้นที่ข้อความด้านล่างแถบแท็บ
4
คัดลอกข้อมูลที่เข้ารหัส
คลิกปุ่ม 'คัดลอก' เพื่อคัดลอกข้อมูลที่เข้ารหัสไปยังคลิปบอร์ดของคุณ
เข้ารหัสรูปภาพสำหรับการพัฒนาเว็บไซต์
ฝังรูปภาพลงใน HTML โดยตรงโดยไม่ต้องใช้ไฟล์ภายนอกโดยการแปลงเป็นรูปแบบ base64 หรือ DataURL วิธีนี้ทำให้กระบวนการพัฒนาเว็บไซต์ง่ายขึ้นและลดจำนวนคำขอ HTTP การทำให้การรวมภาพง่ายขึ้น วิธีนี้สนับสนุนการพัฒนาหน้าเว็บที่เร็วและมีประสิทธิภาพมากขึ้น
คัดลอกข้อมูลภาพเข้ารหัสอย่างรวดเร็ว
หากคุณกำลังทำงานกับภาพที่ต้องการผสานรวมโดยตรงเข้ากับโค้ดหรือฝังโดยไม่มีไฟล์ภายนอก เครื่องมือของเราช่วยเข้ารหัสรูปภาพเป็นรูปแบบ base64 หรือ DataURL ซึ่งช่วยให้ผสานรวมเข้ากับโปรเจกต์ของคุณได้อย่างราบรื่น อัปโหลดรูปภาพของคุณ เลือกรูปแบบที่ต้องการ และคัดลอกข้อมูลที่เข้ารหัสเพื่อใช้ภายในโค้ดหรือเนื้อหาที่ฝังไว้ วิธีการนี้รองรับสถานการณ์ที่การอ้างอิงไฟล์ภายนอกไม่สามารถทำได้ เช่น การแสดงผลภาพแบบอิงโดยตรงใน HTML หรือการใช้ Data URI ในเว็บแอปพลิเคชัน
คำถามที่พบบ่อย
ข้อมูล URL คืออะไร และฉันสามารถใช้มันได้อย่างไร
DataURL เป็นการแทนภาพด้วยข้อความ ทำให้สามารถใส่ภาพนั้นลงใน HTML หรือ CSS โดยตรง โดยไม่ต้องมีไฟล์ภาพแยกต่างหาก เหมาะสำหรับภาพขนาดเล็ก หรือเมื่อต้องการหลีกเลี่ยงการร้องขอ HTTP เพิ่มเติม
ฉันจะใช้ตัวสร้าง URL รูปภาพเป็นข้อมูลได้อย่างไร
อัปโหลดรูปภาพของคุณ เลือกแท็บ ‘Base64’ หรือ ‘DataURL’ ข้อมูลที่เข้ารหัสจะปรากฏขึ้น คลิกปุ่ม ‘คัดลอก’ เพื่อคัดลอกโค้ดอย่างรวดเร็ว
ไฟล์ประเภทใดที่รองรับ
เครื่องมือรองรับรูปแบบไฟล์ภาพทั่วไป เช่น JPG, PNG, GIF และ SVG
ทำไมจึงไม่แนะนำรูปภาพขนาดใหญ่
รูปภาพขนาดใหญ่มักสร้างสตริงข้อมูลที่ยาว ซึ่งอาจทำให้คอมพิวเตอร์ทำงานช้าลง เพื่อผลลัพธ์ที่ดีที่สุด ให้ใช้รูปภาพขนาดเล็ก
ฉันสามารถใช้สิ่งนี้เพื่อฝังไอคอนในเว็บไซต์ของฉันได้ไหม
ใช่ เป็นวิธีที่ดีในการใส่ไอคอนหรือภาพขนาดเล็กลงใน HTML หรือ CSS ของคุณโดยตรง