تحويل الصور إلى SVG — من PNG وJPG إلى متجه
تتبّع الصور النقطية وتحويلها إلى SVG متجهي مع شريطين للألوان والتفاصيل
تعمل في متصفحك · لا يُرفع أي شيء
تُختزل الصورة إلى بضعة ألوان، ويُتتبَّع محيط كل منطقة لونية بخطوط ومنحنيات. يناسب ذلك الشعارات والأيقونات والحروف المرسومة والرسوم البسيطة. أما الصور الفوتوغرافية فتخرج بمظهر الملصقات وقد يصبح الملف كبيرًا جدًا، ولا يمكن الإبقاء على التدرجات والحواف الناعمة كما هي.
أفلت صورة لتحويلها إلى SVG
صورة واحدة بصيغة JPG أو PNG أو WebP أو GIF أو BMP (حتى 50 ميغابايت). يمكنك أيضًا اللصق بالضغط على Ctrl+V (أو ⌘V على Mac). لا يُرفع أي شيء.
أقصى عدد من الألوان يمكن أن يستخدمه ملف SVG. جرّب من 2 إلى 8 للشعارات، و16 أو أكثر للرسوم التوضيحية.
القيمة الأعلى تتبع الحدود بدقة أكبر وتحتفظ بالنقاط الصغيرة، لكنها تكبّر الملف وتستغرق وقتًا أطول. 1 بسيط، و5 الأقرب إلى الأصل.
ما الذي تفعله الأداة؟
تحوّل هذه الأداة صورة نقطية (PNG أو JPG أو WebP أو GIF أو BMP) إلى رسم SVG متجهي. الصور النقطية شبكات من البكسلات تصبح مربعة عند التكبير، أما SVG فيخزّن خطوطًا ومنحنيات فيبقى حادًا بأي حجم. تفيدك عندما يضيع ملف الشعار الأصلي ولا يبقى إلا ملف PNG صغير، أو عندما تحتاج إلى أيقونة لموقع، أو إلى رسم متجهي للقص بالليزر أو التطريز أو الملصقات.
اعرف الحدود أولًا. تُختزل الصورة إلى عدد قليل من الألوان ويُتتبَّع محيط كل منطقة لونية، لذا لا يمكن الإبقاء على التدرجات والحواف الناعمة وملمس الصور الفوتوغرافية كما هي. كلما كان الرسم أبسط وأكثر تسطحًا كانت النتيجة أنظف.
طريقة الاستخدام
- أفلت صورة أو انقر اختيار صورة. ويعمل اللصق بالضغط على Ctrl+V أيضًا.
- اضبط الألوان: 2 لشعار بالأبيض والأسود، ومن 4 إلى 8 لشعار بألوان قليلة، و16 أو أكثر للرسوم التوضيحية.
- اختر التفاصيل من 1 إلى 5. القيمة الأعلى تتبع الحدود بدقة أكبر.
- قارن المعاينة بالأصل، ثم انقر حفظ SVG أو انسخ الشيفرة.
كيف تعمل الأداة؟
- تقليل الألوان: يُنسب كل بكسل إلى ألوان لوحة مأخوذة بالعينات، وتُحسَّن على ثلاث مراحل. الصورة نفسها مع الإعدادات نفسها تعطي دائمًا ملف SVG نفسه.
- التتبّع: تُطابَق حواف المناطق اللونية بخطوط مستقيمة ومنحنيات تربيعية. التفاصيل 1 تسمح بخطأ 4 px وتحذف الأشكال التي يقل محيطها عن 32 نقطة؛ والتفاصيل 5 تتبع الحدود بفارق 0.25 px وتحتفظ بالنقاط الصغيرة.
- حجم التحليل: للسرعة يُصغَّر الضلع الأطول إلى 300 px عند التفاصيل 1، و700 px عند 3، و1400 px عند 5، ثم تُعاد الإحداثيات إلى الحجم الأصلي.
- التنظيف: تُحذف الأشكال ذات الألوان الشفافة تمامًا، ويُضبط العرض والارتفاع الأصليان مع viewBox.
- يستخدم التتبّع مكتبة imagetracerjs (ملكية عامة).
أمثلة
| الأصل | الإعدادات | النتيجة |
|---|---|---|
| شعار بحروف سوداء PNG بحجم 800×300 | لونان، التفاصيل 3 | حروف سوداء على أبيض، وملف صغير |
| أيقونة بأربعة ألوان PNG بحجم 512×512 | 4 ألوان، التفاصيل 4 | 4 ألوان ومنحنيات ناعمة |
| صورة منظر طبيعي JPG بحجم 4000×3000 | 16 لونًا، التفاصيل 2 | مظهر ملصق، وملف أكبر بكثير من الشعار |
لإعادة الرسم المتجهي إلى PNG استخدم SVG إلى PNG؛ ولمجموعة أيقونات لموقعك جرّب مولّد الأيقونات المفضلة (favicon).
الأسئلة الشائعة
هل يمكنني تحويل صورة فوتوغرافية إلى SVG؟
يمكنك، لكنها تخرج على شكل مساحات قليلة بألوان مسطحة مثل الملصق، وقد ترفع التفاصيل العالية حجم الملف إلى عدة ميغابايتات. الأفضل إبقاء الصور الفوتوغرافية بصيغة JPG أو WebP؛ فهذه الأداة تناسب الشعارات والأيقونات والحروف المرسومة والرسوم البسيطة.
في النتيجة نقاط صغيرة كثيرة.
خفّض التفاصيل للتخلص من البقع الصغيرة، وخفّض عدد الألوان لدمج الألوان المتشابهة. وإذا كان الأصل ملف JPG فيه تشويش، فعدد ألوان من 2 إلى 8 يفيد أكثر من غيره عادةً.
هل تبقى الخلفية الشفافة؟
نعم. المناطق الشفافة تمامًا لا تنتج أي أشكال، فتبقى فارغة في SVG. والمناطق شبه الشفافة تأخذ عتامة اللون.
ما حجم ملف SVG المحفوظ؟
يحمل عرض الصورة الأصلية وارتفاعها بالبكسل إضافة إلى viewBox، فيتغير مقياسه بسلاسة إلى أي حجم على الويب أو في تطبيقات التصميم.
هل تُرفع صورتي؟
لا. التحليل والتتبّع كلاهما يجريان داخل متصفحك.
