الترميز 🔒 يعمل داخل متصفحك — لا تُرسل أي بيانات

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

حوّل صورة إلى سلسلة Base64 أو إلى data URI جاهز للصق، دون رفعها إلى أي مكان.

الإدخال
الإخراج

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

تضمين الصورة بصيغة Base64 يتيح لها أن تنتقل داخل النص: في رسالة بريد HTML، أو ملف CSS، أو حمولة JSON، أو صفحة HTML واحدة مكتفية بذاتها. ويقرأ المتصفح الصورة مباشرة من السلسلة، فلا ملف إضافي تستضيفه ولا طلب شبكة إضافي.

تفتح هذه الصفحة مُرمِّز Base64 وفاكّ ترميزه على تبويب «ملف» مع تفعيل بادئة data URI. ويجري الترميز بالكامل داخل متصفحك.

أين تلصق النتيجة

الموضعمثال
صورة في HTML<img src="data:image/png;base64,iVBORw0…" alt="Logo">
خلفية في CSSbackground-image: url("data:image/svg+xml;base64,PHN2Zy…");
حقل JSON{"avatar": "iVBORw0KGgo…"} (عادةً دون البادئة)
Markdown![icon](data:image/png;base64,iVBORw0…) حيث يسمح بذلك محرّك العرض

متى يكون التضمين فكرة جيدة

  • الأيقونات والشعارات الصغيرة ذات الكيلوبايتات القليلة، حيث يكلّف الطلب الإضافي أكثر من زيادة الحجم.
  • رسائل البريد بصيغة HTML، حيث تُحجب الصور الخارجية افتراضيًا في أحيان كثيرة (ويتفاوت دعم data URI بين برامج البريد، فاختبر أولًا).
  • الملفات المكتفية بذاتها مثل التقارير المصدَّرة أو العروض التجريبية التي تعمل دون اتصال.
  • الواجهات البرمجية التي لا تقبل الصور إلا بصيغة Base64 داخل JSON.

ومتى لا يكون كذلك

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

SVG: فكّر في الاستغناء عن Base64

صيغة SVG نصية أصلًا. وفي CSS يمكنك غالبًا تضمينها بترميز الروابط بدلًا من Base64، وهذا أصغر حجمًا، مثل url("data:image/svg+xml,%3Csvg …%3E"). ويتولّى مُرمِّز الروابط هذا الترميز.

العودة من Base64 إلى صورة

لاستعادة الصورة من سلسلة، الصقها في فك ترميز Base64: تُعرض الصور في معاينة ويمكن تنزيلها بالامتداد الصحيح.

أدلة ذات صلة