SVG / الأيقونات

مولد سبرايت SVG: الرموز وطريقة استخدام الأيقونات

اسحب عدة أيقونات SVG لإنشاء سبرايت رموز. نقّح الترميز، وأزل التكرار من معرّفات أسماء الملفات، واحتفظ بـ viewBox، وحوّل التعبئات اختياريًا إلى currentColor، ثم نزّل sprite.svg.

مولد سبرايت SVG: الرموز وطريقة استخدام الأيقونات: أدخل مجموعة من أيقونات SVG واحصل على ملف سبرايت واحد يحتوي على رمز لكل أيقونة، بالإضافة إلى مقتطف استخدام كل أيقونة. تُزال النصوص البرمجية والموارد الخارجية وكل ما هو غير آمن، وتتحول الأبعاد إلى viewBox عند الحاجة، ويمكن تحويل التعبئات إلى currentColor لتتبع الأيقونات لون النص. يعمل 100% محليًا في المتصفح، من دون رفع أي ملفات إلى الخادم.

الفئة
أدوات المطورين
مرات التشغيل
في المتصفح
التكلفة
مجاني · بلا تسجيل
التوفر
جاهز للاستخدام
Sprite لأيقونات SVGمعالجة محلية

تعمل بالكامل في المتصفح

حتى 60 أيقونة · 1 MB لكل منها · يؤدي اختيار الملفات إلى استبدال المجموعة الحالية

تُزال البرامج النصية، ومعالجات الأحداث، والموارد الخارجية، والصور المضمّنة، والنصوص، والعناصر غير المدعومة. تتحول الأنماط المضمّنة الأساسية إلى سمات عرض. يستخدم viewBox المفقود العرض والارتفاع الرقميين، مع اعتماد 24 وحدة كقيمة احتياطية لكل بُعد مفقود. تحقّق من كل معاينة قبل الاستخدام.

تحرير أيقونة SVG

الرموز وإعادة الاستخدام

يحدّد SVG 2 عنصري symbol وuse وسلوك viewBox الخاص بهما: https://www.w3.org/TR/SVG2/struct.html#SymbolElement ؛ https://www.w3.org/TR/SVG2/struct.html#UseElement

المعالجة المحلية والرسم

تُعاد بناء كل أيقونة من قائمة بعناصر وسمات SVG الآمنة، لذلك لا يمكن للبرامج النصية أو معالجات الأحداث أو الموارد الخارجية الوصول إلى sprite. لا تتضمن الأداة مجموعة أيقونات من جهة خارجية. يُحدَّد رسم SVG وcurrentColor على https://www.w3.org/TR/SVG2/painting.html . تظل تراخيص الأيقونات التي تُحمّلها مسؤوليتك.

طريقة الاستخدام

  1. اسحب ما يصل إلى 60 أيقونة SVG، على ألا يتجاوز حجم كل منها 1 MB.
  2. افحص المعاينات المنقّحة، وحوّل التعبئات اختياريًا إلى currentColor.
  3. نزّل السبرايت، ثم اختر أيقونة لنسخ مقتطف استخدامها.

الخصوصية والقيود

تبقى ملفات SVG على جهازك. لا تجلب الأداة عناوين URL المضمّنة ولا ترفع الأيقونات.

أدوات ذات صلة

محرر SVGمنظّف SVGSVG إلى JSXأداة ورقة الرسومات

الأسئلة الشائعة

كيف أستخدم السبرايت؟

أدرج ملف SVG مرة واحدة داخل حاوية مخفية في الصفحة، ثم استخدم المقتطفات المضمّنة التي نسختها. ولاستخدام ملف منفصل، استخدم sprite.svg#id بدلًا من ذلك في href.

ماذا يحدث عند غياب viewBox؟

تحدّد قيمتا العرض والارتفاع الرقميتان، بما في ذلك الوحدات px، viewBox جديدًا. وتُضبط أي قيمة مفقودة أو غير مدعومة على 24 وحدة. توضّح المعاينة viewBox التي أُصلحت حتى تتمكن من التحقق من عدم اقتصاص المحتوى.

هل تحتفظ كل أيقونة بمظهرها الدقيق؟

لا. تُحافَظ على الأشكال الأساسية والمجموعات والتدرجات والقص والأقنعة، لكن تُزال النصوص البرمجية والنصوص والصور المضمّنة وعناصر use والتنسيقات غير المدعومة. تحقّق من المعاينة. وتبقى مسؤولًا عن تراخيص الأعمال الفنية التي ترفعها.

أداة مجانية · عدد مرات الاستخدام في المتصفح · لا يتطلب حسابًا