تحويل الصورة إلى Base64

حوّل صورة إلى Data URI بترميز Base64 لاستخدامه في CSS أو HTML أو JSON، أو الصق سلسلة Base64 واستعد ملف الصورة.

أفلت ملفاتك هنا

⁦.jpg, .jpeg, .png, .gif, .webp, .svg, .bmp, .avif, .ico, .txt⁩ · حتى 10 م.ب

اختيار الملفات

صورة إلى Base64Base64 إلى صورة

إعدادات إضافية

الإخراجفاصل أسطر كل 76 حرفًا

كيفية تحويل صورة إلى Base64

1
إفلات الصورة أو لصق سلسلة Base64
أضف حتى عشرين صورة لترميزها، أو بدّل الاتجاه والصق سلسلة لديك. ويصلح أيضًا ملف .txt يحتوي على السلسلة.
2
اختيار الاتجاه
الترميز يعطيك Data URI أو محتوى Base64 الخام. وفك الترميز يعطيك ملف صورة قابلًا للتنزيل بالامتداد الصحيح.
3
نسخ السلسلة أو تنزيل الملف
انسخ النتيجة مباشرة إلى ملف الأنماط، أو احفظ الصورة بعد فك ترميزها. وتصلك دفعة الصور في أرشيف ZIP فيه ملف نصي لكل صورة وملف JSON يجمعها كلها.

ما الذي يفعله Base64 فعلًا

لا يضغط Base64 شيئًا ولا يحوّل أي صيغة. إنه يعيد كتابة البايتات نفسها باستخدام 64 حرفًا فقط تبقى سليمة عند لصقها في نص. كل ثلاثة بايتات تصبح أربعة أحرف، ولهذا تكون النتيجة دائمًا أكبر من الملف بنحو الثلث. والغاية ليست الحجم بل الموضع: يمكن أن يوضع Data URI مباشرة داخل ملف أنماط أو سمة HTML أو حقل JSON، في أماكن يكون فيها الرابط إلى ملف منفصل غير مريح أو غير ممكن.

Data URI أم المحتوى الخام

Data URI هو السلسلة الكاملة التي تبدأ بالبادئة data:image/png;base64, وهو ما يتوقعه المتصفح في خلفية CSS أو في سمة src لعنصر img. أما المحتوى الخام فهو كل ما بعد تلك الفاصلة، وهو ما يطلبه عادة حقل في واجهة برمجة أو عمود في قاعدة بيانات، لأن النوع يُسجَّل هناك منفصلًا. وكلاهما من البايتات نفسها، فيمكنك التبديل بينهما دون إعادة ترميز أي شيء.

النوع يُقرأ من البايتات

نوع MIME المكتوب في Data URI يُقرأ من أول اثني عشر بايتًا في الملف لا من اسمه، فملف PNG أعاد أحدهم تسميته إلى .jpg يخرج مع ذلك بالنوع data:image/png. وهذا مهم، لأن المتصفح يرفض عرض Data URI لا يطابق نوعه المعلن المحتوى، وحين يحدث ذلك تبدو الصفحة معطوبة لا الملف. صيغة SVG هي الاستثناء لأنها نص: تُعرف من وسمها الافتتاحي لا من توقيع ثنائي.

فك الترميز إلى ملف

الصق أي شيء: Data URI كاملًا، أو محتوى خامًا، أو سلسلة فيها فواصل أسطر. تُزال المسافات البيضاء، وتُفحص الحروف قبل فك الترميز، فيفشل اللصق المبتور فورًا بدل أن ينتج ملفًا تالفًا. ثم تُطابَق البايتات الناتجة مع جدول التواقيع نفسه لاختيار الامتداد. وإذا لم تطابق البايتات أي صيغة معروفة، تنفتح قائمة الصيغ لتحدد بنفسك ما يجب أن تكون.

لا يُرسل أي شيء إلى أي مكان

يستخدم الترميز واجهة FileReader المدمجة في المتصفح، ويستخدم فك الترميز دالة atob المدمجة فيه. لا مكتبة، ولا رفع، ولا خادم. كل ما تلصقه في المربع يبقى في علامة التبويب، وهذا مهم حين تكون السلسلة مستندًا خاصًا لا شعارًا.

الأسئلة الشائعة

لماذا أحوّل صورة إلى Base64؟

لتضمينها مباشرة بدل الربط إليها. أيقونة صغيرة مضمّنة في CSS توفر طلب HTTP، وصورة داخل محتوى JSON يمكنها المرور عبر واجهة برمجة لا تنقل إلا النص، وقالب بريد إلكتروني يمكنه حمل رسومه بنفسه دون أن تُحظر مراجع خارجية.

كم يزيد حجم الملف؟

بنحو 33 إلى 37 بالمئة. يصرف Base64 أربعة أحرف على كل ثلاثة بايتات، إضافة إلى بادئة Data URI القصيرة. صورة بحجم 100 كيلوبايت تصبح سلسلة بحجم 133 كيلوبايت تقريبًا، ولهذا يستحق التضمين العناء مع الأيقونات، ونادرًا ما يستحقه مع الصور الفوتوغرافية.

ما الفرق بين Data URI وBase64 العادي؟

Data URI هو السلسلة كلها: data:image/png;base64, ثم المحتوى، ويمكن للمتصفحات استخدامه مباشرة مصدرًا للصورة. أما Base64 العادي فهو المحتوى وحده دون أي معلومات عن النوع، وهو ما تتوقعه معظم واجهات البرمجة وحقول قواعد البيانات.

هل يوجد حد لطول هذه السلاسل في المتصفحات؟

المتصفحات الحديثة تتعامل مع Data URI بحجم عدة ميغابايت في CSS وHTML، لكن المحررات والطرفيات وأدوات المقارنة تصبح غير قابلة للاستخدام قبل ذلك بكثير. تقبل هذه الأداة ملفات حتى 10 ميغابايت، تنتج سلسلة بحجم 13.3 ميغابايت تقريبًا، وتفك ترميز سلاسل يصل محتواها إلى 14 ميغابايت.

كيف أفك ترميز سلسلة لا تبدأ بالبادئة data:؟

الصقها واترك نوع الصورة على الوضع التلقائي. تُفحص البايتات بعد فك ترميزها بجدول التواقيع نفسه المستخدم في الترميز، فيُعرف ملف PNG من ترويسته 89 50 4E 47 بصرف النظر عن أي بادئة. وإذا فشل الاكتشاف، اختر النوع من القائمة بنفسك.

هل لصق سلسلة Base64 من شخص آخر هنا آمن؟

يُفك ترميز السلسلة إلى بايتات وتُعرض معاينة صورة داخل علامة التبويب في متصفحك أنت. لا تُرفع أبدًا، ولا تُنفَّذ أبدًا، ولا تُخزَّن أبدًا. فك الترميز مجرد عمليات حسابية، لكن تذكّر أن البايتات التي تحصل عليها موثوقة بقدر مصدرها فقط، فتعامل مع أي نتيجة غير متوقعة بالحذر نفسه الذي تتعامل به مع أي ملف منزّل.

لماذا يفشل فك الترميز أحيانًا؟

في أغلب الأحيان لأن السلسلة ناقصة. لصق مبتور، أو سطر ضاع عند النسخ من طرفية، أو صيغة آمنة للروابط (URL-safe) تستخدم الشرطة والشرطة السفلية بدل علامة الجمع والشرطة المائلة، كلها ستفشل في فحص الحروف. ونسخ السلسلة مجددًا من مصدرها الأصلي يحل المشكلة عادة.