اسحب ملف SVG أو انقر للاختيار
SVG
كيف يعمل
الصيغة SVG متجهية: تصف الأشكال بإحداثيات، لذا يمكن رسمها بأي حجم دون فقدان الحدّة. أما PNG وJPG فهما صورتان نقطيتان بعدد ثابت من البكسلات. والتحويل النقطي هو تحديدًا تلك الخطوة: تثبيت دقة ورسم المتجه على شبكة البكسلات تلك.
لهذا تُختار الدقة قبل التحويل لا بعده. تعيد الأداة كتابة عرض وارتفاع ملف SVG إلى الحجم المطلوب ثم ترسمه، فيعيد المتصفح تتبّع المنحنيات بذلك المقياس بدل تكبير صورة صغيرة. يمكنك تحديد مضاعف (2×، 4×…) أو عرض وارتفاع دقيقين بالبكسل.
يحافظ PNG على الشفافية، بينما لا يدعمها JPG، لذا تُملأ المناطق الشفافة بلون الخلفية الذي تختاره. يجري كل الرسم داخل متصفحك باستخدام Canvas: لا يُرفع الملف ولا شفرة SVG إلى أي خادم.
أمثلة
<svg viewBox="0 0 24 24" width="24" height="24">…</svg>PNG 96 × 96 pxأيقونة بحجم 24 بكسل مع مضاعف 4× تصبح 96 × 96 بكسل، وهو الحجم المعتاد للشاشات عالية الكثافة.<svg viewBox="0 0 1200 630">…</svg>JPG 1200 × 630 pxملف SVG بلا سمتَي width وheight يأخذ حجمه من viewBox؛ هنا يُحوَّل نقطيًا بمقياس 1× لصورة معاينة على الشبكات الاجتماعية.حالات الاستخدام
- إنشاء أيقونات PNG التي تطلبها متاجر التطبيقات أو ملفات manifest للويب، والتي لا تقبل SVG.
- تحويل شعار متجهي إلى PNG بخلفية شفافة لإدراجه في عرض تقديمي أو مستند.
- تصدير مخطط أو رسم بياني بصيغة SVG إلى JPG لإرفاقه في بريد إلكتروني أو رفعه إلى منصّة لا تقبل المتجهات.
- الحصول على نسختَي @2x و@3x من الأيقونة نفسها للشاشات عالية الكثافة.
- إنتاج صورة المعاينة (Open Graph) لموقع انطلاقًا من قالب SVG.
الأسئلة الشائعة
ما الدقة التي ينبغي اختيارها؟
الدقة التي يتطلبها الاستخدام النهائي. للشاشات العادية يكفي الحجم الذي ستُعرض به الصورة؛ وللشاشات عالية الكثافة يُفضَّل ضعف ذلك أو ثلاثة أضعافه. أما للطباعة، فاضرب المقاس بالبوصة في 300 للوصول إلى 300 نقطة لكل بوصة.
لماذا يخرج ملف SVG بحجم غير متوقَّع؟
يُؤخذ الحجم الأولي من سمتَي width وheight؛ وإذا غابتا أو كانتا بنسبة مئوية، تُستخدم نسبة viewBox. وعند غياب كليهما يفترض المتصفح 300 × 150 بكسل. يمكنك تجاهل تلك القيمة وكتابة عرض وارتفاع دقيقين في الوضع المخصّص.
هل تُحفَظ الشفافية؟
نعم في PNG إذا أبقيت خيار الخلفية الشفافة مفعَّلًا. أما JPG فلا يدعم قناة ألفا، لذا يُرسم دائمًا فوق لون صلب: أبيض افتراضيًا، ويمكنك تغييره.
لماذا يفشل ملف SVG الذي يستخدم صورًا أو خطوطًا خارجية؟
عند رسمه داخل صورة، لا يستطيع ملف SVG تنزيل موارد من نطاقات أخرى، فيمنع المتصفح التصدير لأسباب أمنية. الحل هو تضمين تلك الموارد داخل الملف نفسه: الصور كـ data URI والنصوص محوَّلة إلى مسارات.
هل يمكن العودة من PNG إلى SVG؟
ليس مباشرةً: عند التحويل النقطي تُفقد المعلومات المتجهية ولا يبقى سوى البكسلات. واستعادة المنحنيات تتطلّب عملية تتبّع تُعيد بناء أشكال تقريبية لا الأصل نفسه. لذا احتفظ دائمًا بملف SVG الأصلي.