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

جديد

رمّز الصور إلى روابط بيانات Base64 وفُكّ ترميزها إلى صور مجددًا.

Drop an image, click to browse, or paste PNG · JPG · SVG · WebP · GIF — encoded on your device, never uploaded.

Runs entirely in your browser. Nothing is uploaded.

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

هذا المحول المجاني من الصورة إلى Base64 يحوّل أي صورة إلى سلسلة Base64 أو data URI مباشرةً في متصفحك — بدون رفع ملف، ودون تسجيل، ودون تثبيت أي برنامج. اسحب الملف أو انقر للتصفح أو الصق من الحافظة أو أدخل رابط الصورة، وستحصل فوراً على سلسلة data:image/…;base64,… جاهزة للنسخ مع أكواد CSS وHTML وMarkdown.

تعمل الأداة في الاتجاهين: شفّر صورة إلى Base64، أو انتقل إلى التبويب الآخر لفك تشفير سلسلة Base64 إلى صورة قابلة للعرض والتنزيل. وبما أن كل شيء يعمل من جانب المتصفح باستخدام FileReader وCanvas APIs، فإن صورك لا تغادر جهازك أبدًا — مما يجعلها آمنة للشعارات الخاصة واللقطات وأعمال الفن غير المنشورة. وهذا يختلف عن البدائل الشهيرة مثل base64.guru وbase64encoder.io التي ترفع صورك إلى خوادم بعيدة.

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

1. اسحب صورتك وأفلتها في مربع الرفع، أو انقر لاختيار ملف، أو الصق صورة، أو أدخل رابط URL للصورة. 2. تقرأ الأداة الملف محلياً وتولّد data URI بتنسيق Base64 فوراً، مع عرض الحجم الأصلي والحجم بعد الترميز وأبعاد الصورة. 3. انسخ الناتج بالصيغة التي تحتاجها — Base64 الخام، أو data URI كاملة، أو قاعدة background-image في CSS، أو وسم HTML <img>، أو Markdown — أو نزّله كملف .txt.

للاتجاه المعاكس، افتح تبويب Base64 → صورة، والصق data URI أو سلسلة Base64 خام، وستقوم الأداة بفك الترميز ومعاينة الصورة وتقديم تنزيل بنقرة واحدة مع الامتداد الصحيح للملف. الرحلة الكاملة — ترميز ثم فك ترميز — تتحقق من أن ناتج Base64 صحيح ومكتمل.

تضمين صور Base64 في HTML وCSS وMarkdown والبريد الإلكتروني

تتيح لك data URI بتنسيق Base64 تضمين صورة مباشرة داخل كودك كنص بدلاً من الارتباط بملف منفصل. في HTML، ضع السلسلة في خاصية src لوسم الصورة؛ في CSS، ضعها داخل url("…") لتعيين خلفية؛ في Markdown، استخدم الصيغة ![نص بديل](data:image/png;base64,…). هذا يُلغي طلب HTTP إضافياً، وهو مفيد للأيقونات الصغيرة والصفحات ذات الملف الواحد والعروض التوضيحية دون اتصال.

التضمين شائع بشكل خاص في رسائل HTML الإلكترونية، حيث يمنع دمج الصور في الرسالة ظهور روابط معطلة ومطالبات "تنزيل الصور" — وإن كان بعض برامج البريد كـ Outlook قد تحجب صور Base64، لذا اختبر دائماً قبل الإرسال. كما يخزّن المطورون صور Base64 الصغيرة في حمولات JSON وقواعد البيانات وملفات الإعداد حيث يكون الملف الثنائي غير ملائم.

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

في JavaScript، يقوم المتصفح بالعمل نيابةً عنك: const r = new FileReader(); r.onload = () => use(r.result); r.readAsDataURL(file); يمنحك data URI الكاملة. في React، لفّ هذا في معالج onChange على إدخال ملف؛ في Next.js، يمكنك أيضاً ترميز الصور من جانب الخادم باستخدام Buffer.from(bytes).toString('base64') في Node. يستخدم هذا المحول FileReader API بالضبط، لذا ما تنسخه يطابق ما ستحصل عليه في كودك.

في Python، رمّز البايتات الخام باستخدام وحدة base64: base64.b64encode(open('image.png','rb').read()).decode()، ثم سبقها بـ data:image/png;base64,. مع Pillow (PIL)، احفظ الصورة أولاً في مخزن BytesIO ثم رمّز المخزن بـ Base64. استخدم هذه الأداة للتحقق من ناتجك بسرعة دون تشغيل سكريبت.

مقارنة بالمنافسين: UtiloKit مقابل base64.guru وbase64encoder.io وBrowserling

base64.guru من أكثر أدوات Base64 زيارةً على الإنترنت، لكنه يرفع صورك إلى خادمه — وهو مصدر قلق كبير على الخصوصية للشعارات ونماذج المنتجات والوثائق السرية. base64encoder.io يعمل بالمثل، إذ يعالج الملفات من جانب الخادم. أداة Browserling لتحويل الصور إلى Base64 أيضاً من جانب الخادم وتحدّ من المستخدمين المجانيين بحجم الملف (سقف 75 ميغابايت في الخطة المجانية) وعدد التحويلات اليومية.

يعمل UtiloKit بالكامل في متصفحك بدون قيود على حجم الملف سوى ما تستطيعه ذاكرة جهازك، ودون حدود يومية، ودون مغادرة أي بيانات لجهازك. تحصل على نفس الناتج — data URI صالحة — مع مقتطفات إضافية (CSS وHTML وMarkdown) لا توفرها الأدوات المذكورة. بالنسبة للفرق التي تعمل على أصول ملكية خاصة، فارق الخصوصية كبير: لا يرى أي خادم صورك قط.

متى تستخدم Base64 — ومتى لا تستخدمه

Base64 مثالي للأصول الصغيرة النادرة التغيير، لكنه ليس مجانياً: النص المشفَّر أكبر بنحو 33% من الملف الأصلي، والصورة المضمّنة لا يمكن تخزينها مؤقتاً أو تحميلها بكسل على حدة. للصور الكبيرة أو الصور المُعاد استخدامها عبر صفحات كثيرة، سيكون ملف الصورة العادي (مع التخزين المؤقت HTTP) أسرع تحميلاً. كقاعدة عامة، ضمّن الأيقونات والشعارات الصغيرة التي يقل حجمها عن ~10 كيلوبايت، واحتفظ بكل ما هو أكبر كملفات عادية.

سواء كنت تشفّر صورة إلى سلسلة Base64، أو تفك تشفير Base64 إلى صورة، أو مجرد تفحص data URI، فهذه الأداة سريعة وخاصة ومجانية تماماً — كل تحويل يبقى على جهازك. تعمل على iPhone وiPad وأجهزة Android وجميع متصفحات سطح المكتب الحديثة دون الحاجة إلى أي تثبيت.

Frequently asked questions

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

اسحب صورة وأفلتها في المربع أعلاه، أو انقر للتصفح، أو الصقها من الحافظة، أو حمّلها من رابط URL. تقوم الأداة فوراً بتحويل الصورة إلى سلسلة Base64 وتعرض data URI جاهزة للنسخ بصيغة CSS أو HTML أو Markdown. كل شيء يحدث في متصفحك — الصورة لا تُرفع إلى أي خادم أبداً، مما يجعلها آمنة للصور الخاصة أو الحساسة.

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

انتقل إلى تبويب Base64 → صورة والصق data URI (data:image/png;base64,…) أو سلسلة Base64 خام. تقوم الأداة بفك ترميزها ومعاينة الصورة وتتيح لك تنزيلها كملف. تكتشف الأداة التنسيق تلقائياً، لذا تعمل PNG وJPG وSVG وWebP وGIF جميعها. يتم فك الترميز الكامل محلياً في متصفحك — لا يُرسل طلب إلى أي خادم ولا تُنقل سلسلة Base64 إلى أي مكان.

كيف أضمّن صورة Base64 في HTML؟

استخدم data URI بتنسيق Base64 كقيمة src لوسم img: الصق السلسلة المشفرة في src="data:image/png;base64,…". انقر على "نسخ <img>" أعلاه للحصول على وسم صورة كامل جاهز للصق بدون طلب ملف منفصل — مثالي لرسائل البريد الإلكتروني والصفحات ذات الملف الواحد والأيقونات المضمّنة. هذا يُلغي رحلة HTTP إضافية ويعمل حتى عندما يكون ملف الصورة الأصلي غير متاح.

كيف أستخدم صورة Base64 في CSS؟

أشر إلى data URI داخل url() — مثلاً background-image: url("data:image/png;base64,…"). انقر على "نسخ CSS" أعلاه للحصول على قاعدة background-image الكاملة. تضمين الخلفيات والأيقونات الصغيرة بهذه الطريقة يُزيل طلب HTTP ويشيع لأيقونات نظام التصميم ومؤشرات التحميل والعناصر الزخرفية التي نادراً ما تتغير. كما يجعل عروض HTML ذات الملف الواحد مكتفية ذاتياً تماماً.

كيف أحول صورة إلى Base64 في JavaScript؟

في المتصفح، اقرأ الملف بـ FileReader API: const reader = new FileReader(); reader.onload = () => console.log(reader.result); reader.readAsDataURL(file). القيمة reader.result هي data:image/...;base64 URI الكاملة. في React أو Next.js، استدعِ هذا داخل useEffect أو معالج onChange على عنصر input. يستخدم هذا المحول هذا الأسلوب بالضبط، بالكامل من جانب العميل. يمكنك استخدام الناتج هنا للتحقق بسرعة من تطبيق JavaScript الخاص بك دون إعداد خادم محلي.

كيف أحول صورة إلى Base64 في Python؟

افتح الملف في الوضع الثنائي وشفّره: import base64; data = base64.b64encode(open('image.png', 'rb').read()).decode(); uri = f'data:image/png;base64,{data}'. مع PIL/Pillow يمكنك حفظ الصورة أولاً في مخزن BytesIO ثم ترميز بايتات المخزن بـ base64. استخدم هذه الأداة الإلكترونية للتحقق من أن ناتج Python يطابق ما تتوقعه قبل تضمينه في كود الإنتاج.

ما هي data URI بتنسيق Base64 وما استخداماتها؟

تُضمّن data URI بيانات الصورة مباشرةً في HTML أو CSS أو JSON أو البريد الإلكتروني كنص، بحيث تُحمَّل الصورة مع المستند بدلاً من طلب HTTP منفصل. إنها مثالية للأيقونات الصغيرة والشعارات في رسائل HTML الإلكترونية والعروض التوضيحية ذات الملف الواحد وتخزين الصور الصغيرة في قواعد البيانات أو ملفات الإعداد. يستخدمها المطورون أيضاً لتجنب قيود CORS عند تحميل الصور في عمليات canvas على نفس الصفحة. كما تُضمَّن Favicons عادةً كـ data URIs في رأس HTML للتخلص من رحلة شبكة إضافية عند التحميل الأول.

هل يجب تضمين الصور الكبيرة كـ Base64؟

في الغالب لا. يزيد ترميز Base64 حجم البيانات بنحو 33% عن الثنائي الأصلي، والصور المضمّنة لا يمكن تخزينها مؤقتاً بشكل منفصل من قِبل المتصفح أو تحميلها بكسل عبر loading="lazy". احتفظ بـ Base64 للأصول الصغيرة نادرة التغيير كالـ favicons والشعارات الصغيرة أو مجموعات الأيقونات التي يقل حجمها عن ~10 كيلوبايت. للصور الكبيرة وصور الغلاف والأصول المُعاد استخدامها عبر صفحات كثيرة، احتفظ بها كملفات صور عادية تُقدَّم مع رؤوس HTTP للتخزين المؤقت.

هل من الآمن تحويل الصور إلى Base64 هنا؟

نعم، آمن تماماً. يعمل الترميز وفك الترميز بالكامل في متصفحك باستخدام FileReader وCanvas APIs — صورك لا تغادر جهازك ولا يُرسل شيء إلى أي خادم. هذه ميزة خصوصية رئيسية مقارنةً بأدوات مثل <strong>base64.guru</strong> و<strong>base64encoder.io</strong> التي ترفع صورك إلى خوادمها للمعالجة. في UtiloKit، تبقى الصور الخاصة والسرية وغير المنشورة على جهازك طوال عملية التحويل بأكملها. يمكنك حتى قطع الاتصال بالإنترنت بعد تحميل الصفحة وستستمر الأداة في العمل.

ما تنسيقات الصور المدعومة؟

أي تنسيق يستطيع متصفحك قراءته يعمل للترميز، بما في ذلك PNG وJPEG/JPG وSVG وWebP وGIF وAVIF وBMP وICO. يدعم فك الترميز كل نوع MIME قياسي data:image/* ويعرض الناتج معاينةً قبل التنزيل. تحظى ملفات SVG بمعالجة خاصة — يمكن أيضاً تضمين Base64 الخاص بها مباشرةً في CSS دون ترميز باستخدام url('data:image/svg+xml,…') مع ترميز URL، لكن Base64 أكثر شمولاً ويعمل في جميع المتصفحات وبرامج البريد الإلكتروني.

هل يمكنني تضمين صورة Base64 في Markdown أو البريد الإلكتروني؟

نعم. استخدم زر "نسخ Markdown" للحصول على ![نص بديل](data:image/png;base64,…)، أو "نسخ <img>" لبريد HTML الإلكتروني. انتبه إلى أن بعض برامج البريد الإلكتروني (لا سيما Outlook وتطبيق Gmail للجوال) تحذف أو تحجب صور Base64، لذا اختبر قبل الإرسال إلى جمهور واسع. لحملات النشرات الإخبارية، من الأسلم استضافة الصور على شبكة CDN والارتباط بها. لرسائل المعاملات الموجهة لمستلم واحد، يعمل Base64 بشكل موثوق في معظم البرامج.

كيف يقارن UtiloKit بـ base64.guru وbase64encoder.io؟

يعالج كلٌّ من base64.guru وbase64encoder.io صورك من جانب الخادم — تُرفع ملفاتك إلى بنيتهم التحتية. يعمل محول UtiloKit من الصورة إلى Base64 بنسبة 100% في متصفحك: بدون رفع، بدون خادم، بدون تخزين لأي بيانات في أي مكان. يوفر UtiloKit أيضاً مقتطفات CSS وHTML وMarkdown جاهزة للصق، ويدعم التحويل ثنائي الاتجاه (ترميز وفك ترميز)، ويعمل دون اتصال بعد تحميل الصفحة. كما أنه مجاني تماماً بدون قيود على حجم الملف أو عدد التحويلات.

هل محول الصورة إلى Base64 هذا مجاني؟

مجاني تماماً، بدون تسجيل، ودون علامات مائية، ودون قيود على حجم الملف أو عدد الصور. على عكس browserling.com الذي يحدّ من تحويلات الصور المجانية ويشترط خطة مدفوعة للملفات التي تتجاوز حجماً معيناً، فإن UtiloKit لا قيود فيه على الإطلاق. وبما أنه يعمل من جانب العميل، فلا توجد رسوم لكل صورة أو رسوم نطاق ترددي — حوّل أي عدد من الصور وبأي حجم تستوعبه ذاكرة متصفحك.

هل يمكنني استخدام هذه الأداة على iPhone أو Android؟

نعم. الأداة متجاوبة بالكامل وتعمل على كل متصفحات الجوال بما فيها Safari على iPhone وChrome على Android. يمكنك النقر لاختيار صور من بكرة الكاميرا أو تطبيق الملفات، أو لصق رابط URL لتحميل صورة بعيدة. تُنسخ النتيجة إلى الحافظة لتلصقها مباشرةً في Notion أو محرر كود أو أي تطبيق آخر. لا حاجة لتنزيل أي تطبيق — ما عليك سوى فتح الصفحة في متصفح جهازك المحمول وستعمل تماماً كالنسخة المكتبية.

دوّر زوايا أي صورة ونزّل ملف PNG شفافًا — داخل متصفحك.

الصور والوسائط