مولد آیکون PWA

آیکون‌هایی را که یک وب‌اپ نصب‌شدنی نیاز دارد — PNGهای 192 و 512px به‌علاوه‌ی یک site.webmanifest — از یک تصویر واحد بسازید، کاملاً در مرورگرتان.

حریم خصوصی در اولویت: هر تصویر به‌صورت محلی در مرورگر شما پردازش می‌شود. هیچ چیز آپلود، ذخیره یا به هیچ سروری منتقل نمی‌شود.

آیکون‌هایی که یک اپ را نصب‌شدنی می‌کنند

نصب‌شدنی بودن یک وب‌اپ پیشرو تا حدی بر پایه‌ی آیکون‌هایش سنجیده می‌شود: مرورگرها پیش از اینکه یک درخواست نصب پیشنهاد دهند یا آیکون آبرومندی روی صفحه‌ی خانه بگذارند، دنبال یک web manifest می‌گردند که دست‌کم یک PNG با اندازه‌ی 192×192 و یکی با 512×512 را اعلام کرده باشد. این مولد هر دو را از تصویر منبع شما رندر می‌کند و یک site.webmanifest می‌نویسد که به آن‌ها ارجاع می‌دهد، در کنار apple-touch-icon که iOS می‌خواهد و یک favicon.ico برای زبانه‌های معمولی.

آن را برای لانچر شکل دهید

لانچرهای Android ممکن است یک آیکون را در یک دایره یا مربع گردگوشه ماسک کنند، پس اثری که تا لبه پیش می‌رود ممکن است بریده شود. اینجا فاصله‌ی داخلی و یک پس‌زمینه‌ی تک‌رنگ بیفزایید تا بخش مهم، هر ماسکی که اعمال شود، درون ناحیه‌ی امن بماند؛ پیش‌نمایش زنده نتیجه را در هر اندازه نشان می‌دهد. همه‌چیز با Canvas API روی دستگاه شما رندر می‌شود — لوگوی شما هرگز آپلود نمی‌شود — و کل مجموعه به‌صورت یک zip دانلود می‌شود.

پرسش‌های متداول

آیا تصویر من برای ساخت فاوآیکون آپلود می‌شود؟
خیر. فایل favicon.ico، آیکون‌های PNG و منیفست همگی به‌صورت محلی در مرورگر شما با استفاده از Canvas API تولید می‌شوند. تصویر شما هرگز از دستگاهتان خارج نمی‌شود.
چه اندازه‌ها و فایل‌هایی دریافت می‌کنم؟
یک favicon.ico چندوضوحی (16، 32 و 48px)، آیکون‌های PNG در اندازه‌های 16، 32، 48، 180 (apple-touch-icon)، 192 و 512px، یک site.webmanifest، و یک قطعه‌کد HTML برای جای‌گذاری در <head> شما.
آیا می‌توانم یک PNG یا SVG را به ICO تبدیل کنم؟
بله. یک PNG، JPG، SVG یا WebP رها کنید و یک favicon.ico واقعی دانلود کنید. لوگوهای SVG ابتدا به‌صورت محلی با وضوح بالا رستر می‌شوند.
چه تصویری بهترین نتیجه را می‌دهد؟
یک تصویر مربع با لوگویی ساده و پرکنتراست. تصاویر غیرمربع برای جا شدن از مرکز برش می‌خورند؛ از کنترل‌های فاصلهٔ داخلی و شکل استفاده کنید تا آن را به دلخواه خود قاب‌بندی کنید.
چگونه فاوآیکون را نصب کنم؟
بسته را در پوشهٔ ریشهٔ سایت خود از حالت فشرده خارج کنید و قطعه‌کد HTML ارائه‌شده را در <head> صفحاتتان جای‌گذاری کنید. فایل favicon.ico به‌صورت خودکار توسط بیشتر مرورگرها برداشته می‌شود.