Softonic

مولّد Favicon من الأحرف والرموز التعبيرية

أنشئ favicon بسيطاً يسهل تمييزه من دون تجهيز صورة مسبقاً. أدخل حرفاً أو حرفين أوليين أو اختر رمزاً تعبيرياً واحداً، ثم اضبط الشكل ولون الخلفية. تتيح التصاميم النصية أيضاً اختيار لون الأحرف ونمط الخط، بينما يحتفظ الرمز التعبيري بمظهره الأصلي في المتصفح. تتحدّث معاينة 512 px داخل متصفحك، ويضم التنزيل أيقونات المتصفح الصغيرة وأيقونات الأجهزة المحمولة وملفات الإعداد اللازمة لإضافة التصميم إلى موقعك. لا يُرفع أي شيء ولا تُستخدم تقنيات AI.

كيفية إنشاء favicon

  1. 1

    اختر محتوى الأيقونة

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

  2. 2

    نسّق التصميم

    اختر مربعاً أو مربعاً بزوايا مستديرة أو دائرة وحدّد الخلفية. وفي التصميم النصي اختر أيضاً لون الأحرف والخط، أما الرمز التعبيري فيحتفظ بمظهر المتصفح الأصلي.

  3. 3

    راجع المعاينة

    افحص معاينة 512 px وتأكد من بقاء التصميم واضحاً عند تصغيره إلى أيقونة تبويب بحجم 16 px.

  4. 4

    نزّل وثبّت

    نزّل حزمة favicon المنشأة محلياً، وأضف ملفاتها إلى موقعك، ثم الصق مقتطف head المرفق أو عدّله.

محتويات حزمة favicon

يجب أن يصلح تصميم favicon واحد لعدة مواضع، من تبويب المتصفح الصغير إلى شاشة الهاتف الرئيسية. يرسم المولّد التصميم نفسه بالمقاسات العملية التالية ويجمع الملفات محلياً داخل المتصفح.

الملف المقاس أو المحتوى الاستخدام الأساسي
favicon.ico إطارات 16 و32 و48 px تبويبات المتصفح والإشارات المرجعية والبرامج التي تطلب ICO
favicon-16x16.png 16 × 16 px favicon صغير للمتصفح
favicon-32x32.png 32 × 32 px favicon قياسي للمتصفح
apple-touch-icon.png 180 × 180 px أيقونة Apple اللمسية
android-chrome-192x192.png 192 × 192 px أيقونة أصغر لتطبيقات الويب على Android
android-chrome-512x512.png 512 × 512 px أيقونة أكبر لتطبيقات الويب
mstile-150x150.png 150 × 150 px صورة مربع Microsoft
site.webmanifest ملف JSON يشير إلى أيقونات Android للمتصفحات التي تستخدم بيان تطبيق ويب
browserconfig.xml إعداد XML يشير إلى صورة مربع Microsoft ولونه
favicon-head.html مقتطف HTML مراجع جاهزة للنسخ للأيقونات والبيان وإعداد المتصفح

أنشئ favicon واضحاً حتى بحجم 16 px

لا يمثل favicon ملصقاً مصغراً. تختفي التفاصيل الدقيقة والكلمات الطويلة والفروق اللونية الضعيفة سريعاً في حجم تبويب المتصفح. غالباً ما يكون حرف بارز أو علامة قصيرة من حرفين أو رمز تعبيري بسيط أسهل تمييزاً من تركيب معقّد.

  • استخدم تبايناً قوياً بين لون المقدمة والخلفية.
  • اترك فراغاً حول الحروف أو الرمز حتى لا تضغطها أقنعة المنصات.
  • قارن بين المربع والمربع ذي الزوايا المستديرة والدائرة لاختيار أوضح هيئة.
  • راجع الأيقونات الصغيرة المصدّرة إلى جانب معاينة 512 px، فقد يصبح التصميم الواضح بالحجم الكامل غامضاً عند 16 px.
  • اختبر favicon بعد تثبيته في أكثر من متصفح ومع واجهات المتصفح الفاتحة والداكنة.

أضف الملفات المنشأة إلى موقعك

احتفظ بأسماء الملفات وضعها حيث يتوقع مقتطف head المرفق العثور عليها، وغالباً يكون ذلك في جذر الموقع. الصق المقتطف داخل <head> في قالب كل صفحة. إذا كانت منصتك تقدّم الملفات الثابتة من مجلد آخر أو شبكة CDN، فعدّل المسارات في المقتطف والبيان وإعداد المتصفح قبل النشر.

توفر الملفات المرفقة مراجع الأيقونات، لكنها لا تجعل الموقع وحدها تطبيق ويب تقدّمياً قابلاً للتثبيت. قد يتطلب التثبيت حقولاً إضافية في البيان واستضافة آمنة وشروطاً خاصة بالمتصفح.

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

نعم. أدخل حرفاً أو حرفين أوليين، ثم اختر الشكل ولون الخلفية ولون المقدمة ونمط الخط. يظل النص قصيراً عمداً حتى يكون أوضح في مقاسات favicon الصغيرة.

نعم. اختر رمزاً تعبيرياً واحداً، ثم حدّد الشكل المحيط ولون الخلفية. يحتفظ الرمز بمظهر المتصفح الأصلي، لذلك قد يختلف بين أنظمة التشغيل والمتصفحات. راجع المعاينة قبل التنزيل، فقد لا تتوفر الرموز المركّبة في كل متصفح.

نعم. تضم الحزمة favicon.ico بإطارات 16 و32 و48 px، وملفي PNG منفصلين بمقاسي 16 و32 px، وأيقونات أكبر لاستخدامات Apple وAndroid وMicrosoft.

ينشئ المولّد تصميماً جديداً من الأحرف الأولى أو نص قصير أو رمز تعبيري واحد. أما المحوّل فهو أداة مستقلة لتحويل صورة PNG أو JPEG أو WebP موجودة إلى ملفات favicon.

لا. تبقى الأحرف أو الرمز ومعالجة المعاينة وإنشاء الحزمة داخل متصفحك. لا ترفع الأداة التصميم ولا تجلب موقعاً إلكترونياً.

لا. يطبق خياراتك فقط ولا يستخدم AI، كما لا يستطيع تحديد تعارض الأحرف أو الرمز أو الألوان أو التصميم النهائي مع علامة تجارية أو حقوق طرف آخر. تحقّق من الحقوق قبل الاستخدام التجاري.

غالباً ما تخزّن المتصفحات favicon مؤقتاً. تأكد من نشر الملفات ومراجع head في المسارات الصحيحة، ثم امسح ذاكرة المتصفح المؤقتة أو جرّب نافذة خاصة. تحدّث محركات البحث وبعض المنصات الأيقونات وفق جداولها.

أدوات ذات صلة

منتقي ألوان Material Design

تصفح لوحة ألوان Material Design وانسخ أي درجة (من 50 إلى A700) بصيغة HEX أو RGB أو HSL بنقرة واحدة.

مولد الورق المسطر

أنشئ ورقًا مسطرًا قابلًا للطباعة مجانًا. اختر تسطيرًا جامعيًا أو واسعًا أو ضيقًا، واضبط تباعد الأسطر بالمليمتر وحجم الصفحة وخط هامش، ثم اطبع أو نزّل ملف SVG.

مولّد ورق الرسم البياني

أنشئ ورق رسم بياني قابلاً للطباعة عبر الإنترنت: اختر شبكة مربّعات أو نقاطاً، واضبط التباعد بالمليمتر، وحدّد A4 أو Letter ولون خطوط مخصّصاً، ثم اطبع أو نزّل ملف SVG واضحاً.

صانع الأعلام

صمّم علماً مخصصاً بسيطاً بنسبة 3:2 في متصفحك باستخدام ستة تخطيطات وألوان ونص ورمز. نزّل SVG أو PNG، أو افتح مربع حوار الطباعة في المتصفح.

صانع لوحة الرؤية

حوّل أهدافك إلى لوحة بصرية: ارفع الصور وأضف عنوانًا وتعليقات شخصية واختر الألوان والتخطيط ثم نزّل صورة PNG قابلة للطباعة. كل شيء يبقى في متصفحك.

منشئ قوائم التصنيف إلى مستويات

أنشئ قائمة تصنيف خاصة من نصوص وصور محلية، وخصص المستويات ورتب بالسحب أو لوحة المفاتيح، ثم صدّر JSON أو PNG أو SVG.

الأداة متاحة بلغات أخرى