Base64
Image Data URL
⚠️ Large image may freez the browser
แปลงรูปภาพเป็น Data URI ออนไลน์
แปลงรูปภาพเป็น Data URI ออนไลน์โดยใช้เครื่องมือ อัปโหลดรูปภาพของคุณ เลือกตัวเลือก Base64 และสร้างโค้ด ปุ่ม Copy ดึงโค้ดเพื่อนำไปใช้ในโปรเจกต์ของคุณ วิธีนี้มีประโยชน์สำหรับการฝังรูปภาพลงใน HTML โดยตรงโดยไม่ต้องพึ่งพาไฟล์ภายนอก
Image → Base64 / Data URL
Click or Drag & Drop an Image
แปลงรูปภาพเป็น Data URIs
1
อัปโหลดรูปภาพของคุณ
อัปโหลดรูปภาพของคุณโดยคลิกหรือลากไฟล์ไปยังพื้นที่อัปโหลด
2
เลือกรูปแบบข้อมูล
เลือกรูปแบบที่ต้องการ: เลือกแท็บ 'Base64' หรือ 'DataURL'
3
ดูข้อมูล URI
รหัส Base64 หรือ DataURL สำหรับรูปภาพของคุณจะปรากฏในพื้นที่ข้อความด้านล่างแท็บ
4
คัดลอกโค้ดที่สร้างขึ้น
คลิกปุ่ม 'คัดลอก' เพื่อคัดลอกโค้ดที่สร้างขึ้นอย่างรวดเร็ว
ฝังรูปภาพลงในหน้าเว็บโดยตรง
ฝังรูปภาพเป็น Data URIs เพื่อรวมภาพเข้าไปใน HTML โดยตรงโดยไม่ต้องพึ่งพาภายนอก แปลงรูปภาพเป็น Data URIs เพื่อลดเวลาในการโหลดและกำจัดความเสี่ยงของการเชื่อมโยงที่ขาดหายไป ซึ่งวิธีนี้ช่วยให้การจัดการโครงการเป็นระเบียบและปรับปรุงประสิทธิภาพสำหรับแอปพลิเคชันที่ต้องการการส่งภาพที่น่าเชื่อถือ นักพัฒนาสามารถใช้แนวทางนี้เพื่อจัดการสินทรัพย์ได้อย่างมีประสิทธิภาพในโครงการที่มีการเข้าถึงอินเทอร์เน็ตจำกัดหรือข้อจำกัดด้านทรัพยากรที่เข้มงวด
คัดลอกโค้ดที่สร้างขึ้นอย่างรวดเร็ว
ปรับปรุงขั้นตอนการทำงานของคุณโดยการฝังรูปภาพลงในโค้ดโดยตรงโดยไม่ต้องพึ่งพาไฟล์ภายนอก ฟีเจอร์ "คัดลอกโค้ดที่สร้างขึ้นอย่างรวดเร็ว" ช่วยให้คุณสามารถคัดลอกโค้ด Base64 หรือ DataURI หลังจากสร้างขึ้น ซึ่งจะช่วยให้คุณวางโค้ดลงในโปรเจกต์เพื่อใช้งานทันที วิธีนี้ทำให้การรวมรูปภาพเข้ากับฐานโค้ดง่ายขึ้นโดยการขจัดความจำเป็นในการจัดการไฟล์แยกต่างหาก
คำถามที่พบบ่อย
ข้อมูล URI คืออะไร และทำไมฉันถึงต้องใช้มัน
Data URI คือวิธีหนึ่งในการฝังรูปภาพลงในโค้ดของคุณ (เช่น HTML หรือ CSS) โดยตรง แทนที่จะลิงก์ไปยังไฟล์รูปภาพแยกต่างหาก สิ่งนี้อาจมีประโยชน์สำหรับรูปภาพขนาดเล็กหรือเมื่อคุณต้องการหลีกเลี่ยงการพึ่งพาภายนอก
ฉันจะใช้ตัวแปลงรูปภาพออนไลน์เป็น Data URI ได้อย่างไร
อัปโหลดรูปภาพของคุณ จากนั้นคลิกที่แท็บ 'DataURI' หรือ 'Base64' เพื่อสร้างรหัสที่สอดคล้องกัน ใช้ปุ่ม 'คัดลอก' เพื่อคัดลอกรหัสที่สร้างขึ้นอย่างรวดเร็ว
ฉันสามารถใช้เครื่องมือนี้เพื่อแปลงรูปภาพขนาดใหญ่ได้ไหม
ในขณะที่คุณสามารถทำได้ รูปภาพขนาดใหญ่อาจทำให้คอมพิวเตอร์ของคุณช้าลงในระหว่างการแปลง เราแนะนำให้ใช้รูปภาพขนาดเล็กเพื่อให้ได้ผลลัพธ์ที่ดีที่สุด
อะไรคือความแตกต่างระหว่าง DataURI และ Base64
ทั้ง DataURI และ Base64 จะเข้ารหัสข้อมูลรูปภาพให้อยู่ในรูปแบบข้อความ DataURI จะรวมการเข้ารหัสกับตัวนำหน้านำทางให้เบราว์เซอร์ตีความข้อมูล ในขณะที่ Base64 เป็นเพียงข้อมูลที่เข้ารหัสแล้ว
ฉันสามารถใช้รหัส Data URI ที่สร้างขึ้นได้ที่ไหน
คุณสามารถใช้โค้ดที่สร้างขึ้นใน attributes src ของ HTML, properties background-image ของ CSS หรือที่อื่นๆ ที่คุณต้องการฝังรูปภาพโดยตรงในโค้ดของคุณ