این ابزار درست کار نمی‌کند؟

دربارهٔ ابزار «ساخت فاویکون آنلاین»

این ابزار مجموعه‌ای کامل از فایل‌های favicon را از یک تصویر منبع واحد تولید می‌کند. خروجی شامل favicon.ico کلاسیک، انواع PNG در چندین وضوح (۱۶، ۳۲، ۴۸، ۹۶، ۱۹۲، ۵۱۲)، یک آیکون لمسی Apple، و یک ورودی web manifest است — هر آنچه که یک وب‌سایت مدرن برای تب‌های مرورگر، نشانک‌ها، و میانبرهای صفحه اصلی نیاز دارد.

هر مرورگر و سیستم‌عامل الزامات favicon خود را دارد. تولید یک تصویر و تطبیق آن برای همه پلتفرم‌ها برندسازی مداوم را در هر جایی که سایت شما ظاهر می‌شود تضمین می‌کند: آیکون‌های تب، نوارهای نشانک، لیست‌های تاریخچه، آیکون‌های برنامه، و تصاویر کوچک نتایج جستجو.

یک تصویر مربعی با وضوح بالا (حداقل ۵۱۲×۵۱۲) آپلود کنید. ابزار همچنین تگ‌های HTML <link> متناظر را تولید می‌کند تا در head صفحه شما قرار دهید.

چطور از این ابزار استفاده کنم؟

چطور برای سایت خود favicon PNG بسازم؟

  1. تصویر منبع را آپلود کنید

    یک تصویر مربعی (یا تقریباً مربعی) را در فیلد «Source image» قرار دهید. هر فرمتی که Sharp بخواند — PNG، JPEG، HEIC، AVIF، WebP، GIF. کیفیت بالاتر آرت‌ورک، نتیجهٔ 16×16 بهتر می‌دهد.

  2. چه چیزی تولید می‌شود

    ابزار سه PNG مربعی با اندازه‌های ثابت می‌سازد: 16×16، 32×32 و 48×48. Sharp با fit: cover تغییر اندازه می‌دهد، پس منابع غیرمربعی از وسط به یک viewport مربعی crop می‌شوند.

  3. «اجرا» را بزنید

    نتیجه آرایه files با یک ورودی برای هر اندازه برمی‌گرداند: filename (favicon-16x16.png / favicon-32x32.png / favicon-48x48.png)، mimeType و دادهٔ base64. هر یک را با دکمهٔ خودش دانلود کنید.

  4. در HTML وصل کنید

    PNGها را در /favicon-16x16.png و … روی سرور بگذارید و <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> را در <head> اضافه کنید. برای مرورگرهای فقط-ICO با ابزار دیگری یک .ico جداگانه بسازید.