مولد الأيقونة المصغرة
أنشئ حزمة أيقونة مصغرة كاملة من شعارك في خطوة واحدة. قم برفع صورة مربعة (يُوصى بـ PNG) واحصل على: ملف .ico متعدد الدقة (16×16، 32×32، 48×48)، وأيقونات PNG من 16×16 إلى 512×512 لكل حالة استخدام، وأيقونة Apple Touch لسطح المكتب على iOS، وأيقونات Android Chrome مع دعم التكيف، وملف webmanifest.json لتثبيت تطبيق الويب، وقطعة HTML جاهزة للنسخ. كل شيء في ملف ZIP واحد للتحميل.
ماذا تفعل هذه الأداة؟
يقوم مولد الأيقونة المصغرة بإنشاء جميع ملفات الأيقونات والعلامات اللازمة لوجود الويب الحديث. ينتج ملف favicon.ico التقليدي مع أحجام مدمجة متعددة لدعم المتصفحات القديمة. للمتصفحات الحديثة، يولد أيقونات PNG بأحجام قياسية: 16×16 (تبويبات المتصفح)، 32×32 (Windows)، 180×180 (Apple Touch)، 192×192 (Android)، 512×512 (شاشات الترحيب). يتيح ملف webmanifest.json تثبيت تطبيق الويب التقدمي على Android وChrome OS. تتضمن قطعة HTML جميع وسوم الرابط اللازمة مع سمات rel وأحجام صحيحة.
كيف تعمل
قم برفع صورة مصدر مربعة (يُوصى بـ 512×512 أو أكبر، PNG مع شفافية إذا كان ذلك مناسبًا). تستخدم الأداة إعادة أخذ العينات Lanczos لتوليد جميع الأحجام المطلوبة بجودة عالية. بالنسبة لملف favicon.ico، يتم دمج إطارات PNG متعددة بأحجام 16×16 و32×32 و48×48 باستخدام تنسيق حاوية ICO. يتم إنشاء ملفات PNG فردية لكل حجم مطلوب. يتم بناء ملف webmanifest.json باستخدام حقول قياسية (name, icons, theme_color, background_color). تستخدم قطعة HTML قيم rel صحيحة: icon للأيقونة المصغرة، apple-touch-icon لـ iOS، وmanifest لـ PWA. يتم تغليف جميع الملفات في ملف ZIP مع ملف README يشرح التثبيت.
الميزات
- ملف .ico متعدد الأحجام (16/32/48 متداخل)
- ملفات PNG من 16×16 إلى 512×512 — كل حجم يحتاجه المتصفح
- أيقونة Apple Touch، وiPad، وAndroid، وMicrosoft tile
- ملف site.webmanifest مُنشأ لتثبيت PWA
- قطعة HTML <head> جاهزة للنسخ
- تحميل .zip واحد يحتوي على كل شيء
- إعادة أخذ العينات Lanczos للجودة
كيفية الاستخدام
- 1
أفلت شعارك
الصورة المربعة ≥ 512×512 PNG تعمل بشكل أفضل. الخلفية الشفافة مقبولة ومُوصى بها للاستخدام الحديث.
- 2
انقر على "إنشاء"
يتم إنتاج جميع الأحجام عبر إعادة أخذ العينات Lanczos في ثوانٍ. يعرض المعاينة الأحجام الرئيسية.
- 3
قم بتحميل ملف .zip
قم بفك ضغطه في مجلد /public أو /static؛ الصق قطعة HTML في قسم <head> لموقعك.
- 4
تخصيص (اختياري)
قم بتحرير site.webmanifest لتعديل اسم التطبيق، ولون السمة، ولون الخلفية لعلامتك التجارية.
حالات الاستخدام الشائعة
إطلاق موقع جديد
أنشئ مجموعة أيقونة مصغرة كاملة عند إطلاق موقع جديد لضمان مظهر احترافي على جميع الأجهزة والمنصات.
تحديث العلامة التجارية
قم بتحديث الأيقونات المصغرة عبر جميع الأحجام عند إعادة التسمية أو تحديث الشعار.
التجهيز لتطبيق PWA
احصل على جميع الأيقونات المطلوبة وملف webmanifest.json اللازم لدعم تثبيت تطبيق الويب التقدمي.
تحديث المواقع القديمة
استبدل إعدادات favicon.ico الأحادية القديمة بحزم أيقونات حديثة متعددة التنسيقات والأحجام.
نصائح وأفضل الممارسات
- كثرة الأحجام لأن iOS وAndroid وWindows والمتصفحات المختلفة تطلب أحجامًا مختلفة للتبويبات، وشاشات البداية، وشاشات الترحيب، وما إلى ذلك. تضمن الحزمة الكاملة عرضًا حادًا في كل مكان
- استخدم مصدرًا بحد أدنى 512×512. التقليل من الحجم يبدو جيدًا، لكن التكبير من مصدر صغير يبدو ضبابيًا
- تعمل ملفات PNG الشفافة بشكل أفضل مع المتصفحات الحديثة، ولكن قم بتضمين نسخة بخلفية ملونة للسياقات التي لا تدعم الشفافية
- يؤثر theme_color في webmanifest على واجهة المتصفح (شريط العنوان) على Chrome للهواتف المحمولة — قم بمطابقته مع علامتك التجارية