ما هي صورة Base64؟

صورة Base64 هي طريقة لتمثيل بيانات الصورة الثنائية كنص عادي باستخدام مخطط ترميز Base64. بدلاً من الإشارة إلى ملف خارجي، يتم تضمين الصورة بالكامل مباشرةً كـ string من أحرف ASCII. يُستخدم هذا النهج بشكل شائع في HTML وCSS عبر data URIs (data:image/png;base64,...)، مما يتيح تضمين الصور بشكل مباشر دون الحاجة إلى طلبات HTTP منفصلة. يزيد ترميز Base64 من حجم البيانات بنحو 33%، لكنه يلغي الحاجة إلى استضافة ملفات إضافية أو رحلات شبكة متعددة.

وصف الأداة

تُنشئ هذه الأداة صوراً عشوائية بأنماط وأبعاد قابلة للتخصيص، ثم تُخرج النتيجة كـ string مُرمَّز بـ Base64. اختر من بين خمسة أنماط بصرية — ضوضاء، مستطيلات، دوائر، تدرجات، أو خطوط — واضبط العرض والارتفاع حتى 2048×2048 بكسل، وحدد تنسيق الإخراج (PNG أو JPEG أو WebP). يتم إنشاء الصورة بالكامل في المتصفح باستخدام Canvas API، دون أي رفع للخوادم أو اعتماد على مكتبات خارجية.

أمثلة

الضوضاء العشوائية بدقة 256×256 تُنتج نمطاً ملوناً ثابتاً حيث تحمل كل بكسل قيمة RGB مُعيَّنة عشوائياً — مشابهة للتشويش التلفزيوني ولكن بألوان كاملة.

الدوائر العشوائية بدقة 512×512 ترسم من 10 إلى 40 دائرة شبه شفافة بأحجام وألوان متنوعة فوق خلفية عشوائية، مما يُنتج تركيباً تجريدياً يشبه الفقاعات.

التدرج العشوائي بدقة 800×400 يمزج من 2 إلى 6 ألوان عشوائية على طول تدرج خطي بزاوية عشوائية، مما يُنتج انتقالات لونية سلسة مناسبة للخلفيات.

المميزات

  • خمسة أنواع مميزة من الأنماط: ضوضاء، مستطيلات، دوائر، تدرج، وخطوط
  • أبعاد قابلة للضبط من 1×1 حتى 2048×2048 بكسل
  • ثلاثة تنسيقات للإخراج: PNG وJPEG وWebP
  • إخراج فوري بـ Base64 مع نسخ وتنزيل بنقرة واحدة
  • يعمل بالكامل في المتصفح — لا تغادر بياناتك جهازك

شرح الخيارات

  • العرض / الارتفاع: حدد أبعاد الصورة بالبكسل (1–2048). يتم تأخير تطبيق التغييرات تلقائياً بحيث تتجدد الصورة بسلاسة أثناء ضبط شرائط التمرير.
  • النمط: اختر نوع النمط البصري العشوائي المراد إنشاؤه. يُنتج كل نمط أسلوباً فنياً فريداً باستخدام أشكال وألوان وشفافية عشوائية.
  • تنسيق الصورة: اختر بين PNG (بدون فقدان، حجم أكبر) أو JPEG (مع فقدان، حجم أصغر) أو WebP (حديث وفعّال). يؤثر هذا الخيار على كل من الصورة القابلة للتنزيل ومخرجات Base64.

حالات الاستخدام

  • تضمين صور placeholder أو زخرفية مباشرةً في HTML أو CSS دون استضافة ملفات منفصلة
  • إنشاء صور اختبار لسير عمل التطوير وضمان الجودة التي تتطلب محتوى بصرياً متنوعاً
  • إنشاء فن إجرائي فريد أو خلفيات تجريدية لنماذج التصميم