Telepíthető webalkalmazás
Normál és maskable ikonokat készít a kezdőképernyőre vagy az alkalmazásindítóba telepíthető webapphoz.
Favicon- és PWA-ikongenerátor
Készíts favicon.ico-t, Apple Touch ikont és PWA-ikonokat weboldalhoz vagy alkalmazáshoz. PNG- és SVG-logóból is összeállíthatod a böngészők és telefonok számára szükséges ikoncsomagot.
- Ingyenes
- Reklámmentes
- Regisztráció nélkül
- Napi limit nélkül
Egy képből teljes ikoncsomag
Vágd, igazítsd és ellenőrizd valódi méretben, majd válaszd ki, mely weboldalas és webapp ikonok kerüljenek a ZIP-be.
Húzd ide a logót vagy ikont
PNG, JPG, WebP vagy biztonságosan megtisztítható SVG · legfeljebb 20 MB · ajánlott 1024 × 1024 px
A fájl nem hagyja el az eszközödet.
Kapcsolódó eszközök
Ezek az eszközök gyakran a következő lépést jelentik ugyanebben a munkában.
Pontosan melyik favicon és webapp fájlokra van szükséged?
Az exportcélok szabadon kombinálhatók. Egyszerű weboldalhoz csak a Weboldal opció kell; telepíthető webapphoz válaszd a webappikonokat, és kérésre a használatra kész site.webmanifest fájlt is.
Weboldal
Erre lesz szükséged, hogy megjelenjen az ikon a böngészőfülön.
Jelöld be minden hagyományos weboldalhoz, bloghoz, webshophoz és portfólióhoz.
+ site.webmanifest
Opcionális. A webapp nevét, ikonjait, színeit és indulási beállításait összekapcsoló manifestet készít. Az offline működéshez ettől függetlenül külön service worker szükséges.
A Weboldal fájljai
Ezek adják a böngészős favicon és az Apple Touch ikon támogatását.
favicon.ico- A hagyományos, széles körben támogatott böngészőikon. Egyetlen fájlban tartalmazza a 16, 32 és 48 pixeles változatot.
favicon-16x16.png- A böngészőfül és a nagyon kis méretű böngészőfelületek éles ikonja.
favicon-32x32.png- Nagy pixelsűrűségű kijelzőkön használt favicon, például böngészőfülekhez és könyvjelzőkhöz.
favicon-48x48.png- Nagyobb böngésző- és rendszerfelületekhez használható PNG favicon.
apple-touch-icon.png- Az iPhone és iPad ezt használja, amikor valaki a weboldalt a kezdőképernyőhöz adja.
favicon.svgOpcionális- Modern böngészőkben minden méreten éles, skálázható favicon. Csak akkor kerül a csomagba, ha SVG fájlt töltesz fel.
favicon-code.html- A weboldal <head> részébe másolható, kész HTML hivatkozásokat tartalmazza.
A webapp ikonfájljai
Csak a Telepíthető webalkalmazás opció kiválasztásakor készülnek el.
web-app-manifest-192x192.png- A telepített webalkalmazás normál, kisebb felbontású ikonja Androidon és más PWA-képes rendszereken.
web-app-manifest-512x512.png- A telepítéshez és nagyobb rendszerfelületekhez használt nagy felbontású alkalmazásikon.
web-app-manifest-192x192-maskable.png- Biztonsági margóval készülő kis PWA-ikon, amelyet az operációs rendszer kör, négyzet vagy más alakúra vághat.
web-app-manifest-512x512-maskable.png- A maskable alkalmazásikon nagy felbontású változata telepítési és indítófelületekhez.
A manifest kiegészítés
A + site.webmanifest opció a webapp ikonok mellé a telepítési metaadatokat és a HTML-hivatkozást adja.
site.webmanifest- A telepíthető webalkalmazás stabil azonosítóját, indulási URL-jét, navigációs hatókörét, nevét, ikonjait, színeit és megjelenítési módját leíró, használatra kész fájl.
favicon-code.html- A weboldal <head> részébe másolható manifest hivatkozást és theme-color meta elemet tartalmazza. Ha a Weboldal opciót is kéred, annak favicon hivatkozásai ugyanebbe a fájlba kerülnek.
A README.md minden exportba bekerül, és a kiválasztott fájlokhoz tartozó telepítési lépéseket sorolja fel.
Kinek hasznos egy favicon és PWA ikon generátor?
Új weboldal vagy blog indítása
Ha most készítesz portfóliót, blogot vagy céges oldalt, egyetlen logóból pár másodperc alatt megvan a favicon.ico és az Apple Touch ikon is, amit a legtöbb sablon vagy CMS elvár.
PWA vagy telepíthető webapp fejlesztése
Ha a projekted telepíthetőnek kell lennie a kezdőképernyőre, a maskable ikonok és a site.webmanifest generálásával kihagyhatod a manuális ikonméretezést és a manifest kézi összeállítását.
Arculatváltás vagy meglévő favicon cseréje
Új logóhoz vagy márkafrissítéshez gyorsan legyártod a teljes ikoncsomagot, és a kész HTML-kóddal azonnal frissítheted a weboldal <head> részét.
No-code oldalépítőhöz vagy statikus generátorhoz készülő ikon
Webflow, Framer, Wix, Astro vagy Next.js projektekhez is jó, ahol saját magadnak kell feltöltened a favicon- és ikonfájlokat a publikus mappába.
Adatvédelem
Adatvédelem favicon készítésnél
A faviconcsomag a böngésződben készül el; a forrásképet nem töltjük fel.
- Ha SVG-t töltesz fel, a Morf biztonságosan megtisztítja, mielőtt használja.
- Nincs regisztráció, reklám vagy napi letöltési limit.
Gyakori kérdések
A forrásképről, az ICO-ról, az SVG-ről és a PWA maskable ikonokról.
Milyen képből lesz jó favicon?
Egyszerű, négyzetes, erős kontrasztú grafikát használj. Az 1024 × 1024 px-es forrás ideális; 512 px alatt Morf figyelmeztet, mert a nagy PWA-ikon lágyabb lehet.
Az SVG megmarad vektorosnak?
Igen, ha SVG-t töltesz fel, a csomag a biztonságosan megtisztított SVG-t is tartalmazza. Raszteres képből Morf nem készít ál-vektoros fájlt.
Mi van a favicon.ico fájlban?
Egy szabványos ICO-konténer, benne külön 16 × 16, 32 × 32 és 48 × 48 pixeles PNG frame-ekkel.
Miért különbözik a maskable ikon?
Az Android többféle alakra maszkolhatja az appikont. A külön, nagyobb safe-zone-nal és teljes háttérrel készített változat segít elkerülni a fontos részek levágását.
Ingyenes és korlátlan a favicon generátor?
Igen. A Morf favicon generátora ingyenes, reklámmentes és regisztráció nélkül használható. Nincs napi generálási vagy letöltési limit; a gyakorlati határt csak a saját böngésződ és eszközöd teljesítménye jelenti.