صانع أيقونات PWA (مجاني، سريع وخاص)

قم بتوليد الأيقونات القياسية التي تتطلبها تطبيقات PWA الخاصة بك.

الخصوصية أولاً

  • الملفات لا تغادر متصفحك أبداً
  • لا رفع إلى الخادم
  • تتم المعالجة محلياً على جهازك

ما هي أيقونة PWA ولماذا الحاجة لـ «Maskable Icon»؟

هي الرمز المرئي لتطبيق الويب الخاص بك عندما يتم «تثبيته» على الشاشة الرئيسية أو سطح المكتب. على عكس مواقع الويب الكلاسيكية، يتم تعريف الـ PWA عبر ملف manifest.json، حيث يتم تحديد «مقاس أيقونة PWA» (عادة 192x192 و 512x512). والآن، غيرت «Maskable Icons» في أندرويد قواعد اللعبة. فلديها «منطقة آمنة» (Safe Zone) محددة حول اللوجو، مما يسمح للنظام بقص الأيقونة في أشكال مختلفة بدون الإضرار ببراندينج شركتك. المولد الخاص بنا يتعامل مع الخيارين فوراً، مما يضمن أن الـ PWA الخاصة بك لا تقل جودة بصرياً عن أي تطبيق ناتيف في المتاجر الرسمية.

لماذا تختار مولد أيقونات PWA من Pixes.app؟

التوافق مع جوجل كروم و W3C: نحن نظبط كل اسم ومقاس للأيقونات وفق آخر المعايير للحصول على نقاط Lighthouse كاملة.. تخلص من أخطاء «PWA icon is missing» في اختباراتك التلقائية.

دعم ملف manifest.json متضمن: نحن لا نعطيك صوراً فقط؛ بل نولد كود الـ JSON لتعريفها.. انسخ والصق وتجاوز كل التوثيقات التقنية المملة.

سريع وبسيط: بدون رسوم، بدون تسجيل وبدون إيميلات. فقط نتائج عالية الجودة في ثوانٍ.. سرّع دورة التطوير الخاصة بك مع أداتنا المحسنة.

3 خطوات لطقم أيقونات PWA احترافي

لا مزيد من الصداع بخصوص الكود أو ملفات المانيفست بالمتصفح.

  1. رفع الأيقونة الماستر (512x512): اختر صورة بأعلى دقة لديك، ويفضل أن تكون PNG بمقاس 512x512 بكسل. انقر فوق «اختر صورة».
  2. توليد أيقونات Maskable والقياسية: بمجرد تحميل الملف، ستقوم أداتنا فوراً وبشكل متزامن بتوليد نسخ 192x192 (عام)، و 512x512 (Splash Screen)، و «maskable-icon-512x512».
  3. نسخ كود المانيفست والتحميل: نقوم بتوليد مصفوفة «icons» التي ستحتاجها للصقها في ملف manifest.json الخاص بك. انقر فوق «نسخ الكود» وحمل الطقم الكامل كملف ZIP.

نصائح الخبراء لأيقونات الـ PWA

تحسين نقاط Lighthouse: يتوقع جوجل Lighthouse أيقونات 192x192 و 512x512، بالإضافة لأيقونة «maskable» واحدة على الأقل. أداتنا توفر هذا الطقم بدقة لضمان 100/100 نقطة.

اختيار خلفية الـ Splash Screen: استخدم أيقونة بخلفية PNG شفافة لتندمج بمثالية مع إعداد «background_color» في المانيفست.

هامش اللوجو (المنطقة الآمنة): تأكد من أن اللوجو في المركز مع هامش 10% على الأقل. Pixes.app تفعل هذا تلقائياً لك.

لمن مولد أيقونات PWA الخاص بنا؟

مـطـورو الـفـرونـت إنـد: عند تحويل مشاريع React أو Vue أو Angular لـ PWA، لا تضيع وقتك في الأيقونات. احصل على طقم جاهز للمانيفست في ثوانٍ.

📱 السـتـارتـب الـتـي تـبـدأ بـالـجـوال: قبل إطلاق تطبيقات ناتيف، اختبر البراندينج الخاص بك مع طقم أيقونات PWA بمقاسات مثالية.

🛒 الـتـجـارة الإلـكـتـرونـيـة و SaaS: شجع المستخدمين على «إضافة للشاشة الرئيسية» بأيقونة تعكس جودة ماركتك.

الـمـشـاريـع الـمـهـتـمـة بـالـخـصـوصـيـة: بما أن العملية كلها تتم من طرف العميل (Client side)، فإن أصولك السرية لا تغادر جهازك أبداً.

كيفية استخدام هذه الأداة

  1. اختر صورة بأعلى دقة لديك، ويفضل أن تكون PNG بمقاس 512x512 بكسل. انقر فوق «اختر صورة».
  2. بمجرد تحميل الملف، ستقوم أداتنا فوراً وبشكل متزامن بتوليد نسخ 192x192 (عام)، و 512x512 (Splash Screen)، و «maskable-icon-512x512».
  3. نقوم بتوليد مصفوفة «icons» التي ستحتاجها للصقها في ملف manifest.json الخاص بك. انقر فوق «نسخ الكود» وحمل الطقم الكامل كملف ZIP.

أدوات ذات صلة

الأسئلة الشائعة (FAQ)

ما هي أفضل صيغة ملف لـ PWA؟
صيغة PNG هي المعيار الإلزامي. الـ PNG الشفاف هو الخيار الأفضل للتوافق.
ما هي الأيقونة «Maskable»؟
هي التي تسمح لأندرويد بقص الأيقونة في أشكال متنوعة بدون المس بـاللوجو الأصلي.
ما هي الأيقونات التي يجب إضافتها لـ manifest.json؟
على الأقل 192x192 و 512x512. أداتنا توفر لك بلوك الكود كاملاً.
لماذا لا تظهر أيقونة الـ PWA الخاصة بي بعد التثبيت؟
غالباً ما يكون السبب مساراً خاطئاً في ملف manifest.json. تأكد من مطابقة المسار لم جلدات مشروعك تماماً.