النتائج مقدَّمة لأغراض إعلامية فقط وقد تحتوي على أخطاء. يُرجى التحقق من المعلومات المهمة بشكل مستقل. استخدام هذه الأداة على مسؤوليتك الخاصة.
ماذا تفعل هذه الأداة
تحوّل أداة تحويل الصور إلى Base64 ملف الصورة إلى data URL: سطر نصي واحد يبدأ بـdata:image/png;base64, (أو بنوع ملفك) تليه بايتات الصورة مرمّزة بـBase64. اختر صورة PNG أو JPG أو GIF أو SVG أو WebP أو أي صورة أخرى، فيظهر النص مع معاينة وجاهزًا للنسخ.
يُقرأ الملف باستخدام FileReader في المتصفح، لذا لا يُرفع أبدًا. يمكن استخدام data URL في أي مكان يصلح فيه عنوان صورة عادي: في <img src>، أو في CSS ضمن background-image: url(...)، أو في حمولة JSON، أو في قالب بريد إلكتروني. يجعل Base64 البيانات أكبر بنحو الثلث من الملف الأصلي، لذا فهو أنسب للصور الصغيرة.
متى تستخدمها
- تضمين أيقونة أو شعار صغير في CSS لتُرسل الصفحة طلبًا أقل.
- وضع صورة داخل ملف HTML واحد مكتفٍ بذاته، مثل تقرير أو عرض توضيحي.
- إرسال صورة في طلب JSON إلى API لا يقبل الرفع متعدد الأجزاء (multipart).
- إضافة صورة مضمّنة إلى توقيع بريد إلكتروني بتنسيق HTML أو إلى بيانات اختبار (fixture).
مثال عملي
المدخلات
pixel.png (1 × 1 px، أزرق، 69 بايت)
المخرجات
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVR42mOwbvoGAAKvAbSJsn7VAAAAAElFTkSuQmCCأسئلة حول هذه الأداة
لماذا نص Base64 أكبر من صورتي؟
يكتب Base64 كل 3 بايتات في صورة 4 أحرف نصية، لذا تكون النتيجة أكبر من الملف بنحو 33%. فالصورة التي حجمها 30 KB تصبح نحو 40 KB من النص. ويستعيد ضغط Gzip أو Brotli على الخادم جزءًا من هذه الزيادة.
متى لا ينبغي تضمين الصورة؟
تجنّب ذلك مع الصور الفوتوغرافية الكبيرة والصور المستخدمة في صفحات كثيرة. فملف الصورة العادي يخزّنه المتصفح مؤقتًا مرة واحدة، أما الصورة المضمّنة فتُنزَّل من جديد مع كل ملف HTML أو CSS يحتويها.
كيف أستخدم النتيجة في CSS؟
ضعها داخل url(): background-image: url("data:image/png;base64,...");. أما لأيقونات SVG، فغالبًا ما يكون SVG المرمّز بترميز URL أصغر من Base64؛ ويمكن لصفحة ترميز URL تجهيزه.
كيف أعيد Base64 إلى صورة؟
الصق data URL كاملًا في شريط عنوان المتصفح واحفظ الصورة، أو فك ترميز الجزء الذي يلي الفاصلة باستخدام أداة فك ترميز Base64 إذا كنت تحتاج إلى البايتات الخام.
هل هذه الأداة مجانية؟
نعم، إنها مجانية. دون تسجيل أو بريد إلكتروني. تظهر النتيجة في هذه الصفحة.
كيف أحصل على النتيجة؟
استخدم الأداة في هذه الصفحة. تظهر النتيجة هنا دون الحاجة إلى إرسالها بالبريد الإلكتروني.