Ingyenes konverter

Favicon Generátor

Hozzon létre favicon fájlokat többféle méretben (16x16-tól 512x512-ig) bármilyen képből. Ingyenes, azonnali és teljes egészében a böngészőjében fut.

Drag & Drop ide egy képet

Támogatja a PNG, JPG, SVG, WebP fájlokat. Max 10 MB.

Vagy

Az eszközről

A favicon az a kis ikon, amely a böngésző lapjain, a könyvjelzőkben és az előzmények listáin jelenik meg. Az eredeti favicon – egy 16×16-os ICO-fájl a /favicon.ico címen – összetett ikonkészletté bővült, különböző méretű, különböző platformokon: 16×16 és 32×32 a böngészőlapokhoz, 180×180 az iOS kezdőképernyőjéhez, 192×192 és 512×512-es méretű Windows-ok és csempék Androidhoz. Mindezeket egyetlen forrásképből állítja elő egy modern favicon generátor.

Ez az eszköz egyetlen nagy felbontású forrásképet (általában négyzet alakú emblémát) készít, és létrehozza a favicon elemek teljes készletét, valamint az ezekre való hivatkozáshoz szükséges HTML linkcímkéket. A kimenet ICO-t, több PNG-t és manifest.json fájlt tartalmaz a progresszív webalkalmazás-metaadatokhoz. Dobja a kapott fájlokat a webhelye gyökerébe, és hivatkozzon rájuk a generált HTML-kódon keresztül.

Minden feldolgozás a böngészőjében történik. Nincs feltöltés, nincs API-hívás, nincs sebességkorlát. A kimenet minden modern böngészőn és operációs rendszeren működik, amely kedvenc ikonokat jelenít meg.

Miért generáljon Favicont?

A kedvencek nélküli webhelyek befejezetlennek tűnnek. A böngésző lapjain egy általános ikon látható; a könyvjelzőknek nincs vizuális azonosítójuk; az oldal kevésbé professzionálisnak tűnik. A megfelelő favicon készlet hozzáadása kis erőfeszítéssel, nagy hatású polírozási lépés, amely jelzi a részletekre való odafigyelést.

A modern favicon követelmények túlnőttek a /favicon.ico címen. Az iOS kezdőképernyőjének ikonjai, az Android Chrome ikonjai, a Windows csempeikonjai és a sötét mód változatai mind különböző fájlokat használnak. Az összes egy forrásból történő generálása biztosítja a következetes márkaépítést anélkül, hogy az egyes fájlokat kézzel kellene kezelni.

Használati útmutató

Töltse fel a forrásképet, és szerezze be a teljes favicon készletet.

  1. Forráskép feltöltése: Használjon legalább 512×512 pixeles négyzet alakú képet. A PNG preferált (átlátszóság támogatása); Az SVG is elfogadott. A nagyobb felbontású források élesebb, kisebb ikonokat eredményeznek.
  2. Konfigurálja a platform beállításait: Szükség szerint engedélyezze az iOS, Android, Windows és PWA kimeneteket. Az alapértelmezett beállítások azt a szabványkészletet állítják elő, amelyre a legtöbb webhelynek szüksége van.
  3. Testreszabhatja a színeket és a témát: Válasszon témaszíneket a Windows csempékhez és a PWA indítóképernyőkhöz. Párosítsa a márkaidentitást.
  4. Töltse le és telepítse: Mentse el a generált zip-et. Helyezze el a fájlokat webhelye gyökerébe, és adja hozzá a generált HTML linkcímkéket a <head> oldalához. A HTML minden ikonra a megfelelő méretben hivatkozik.

Gyakori használati esetek

Műszaki részletek

A teljes modern favicon készlet: favicon.ico (16+32+48 többfelbontású), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android2px,1-512px,51-51. mstile-150x150.png. Plusz site.webmanifest PWA-hoz, browserconfig.xml Windows-hoz.

Minden egyes PNG-t a forrásból származó vászon alapú mintavételezéssel állítanak elő. Az ICO JavaScriptben épül fel a 16/32/48 verziók többfelbontású ICO formátumba való kombinálásával DataView írások segítségével.

A HTML linkcímkék minden fájlra hivatkoznak a megfelelő rel és sizes attribútumokkal. A generátor ezeket másolás-beillesztésre kész részletként állítja elő a webhely <fejlécéhez>.

Legjobb gyakorlatok

Gyakran ismételt kérdések

Milyen formátumban töltsem fel a képet?
Átlátszó háttérrel rendelkező PNG működik a legjobban. Használjon legalább 512 x 512 pixeles négyzet alakú képet, hogy az eszköz minőségromlás nélkül tudjon kicsinyíteni. Az SVG is jól működik, mivel bármilyen méretre méretezhető.
Milyen méreteket generál ez?
16x16 (böngésző lap), 32x32 (böngésző lap 2x), 48x48 (Windows tálca), 180x180 (Apple Touch ikon), 192x192 (Android kezdőképernyő), 512x512 (PWA indítóképernyő). Az ICO fájl 16, 32 és 48 képpont méretű.
Hová tegyem a favicon fájlokat?
Helyezze el a favicon.ico-t webhelye gyökérkönyvtárába. A többi PNG-méret a nyilvános mappába vagy bármely elérhető elérési útba kerül. Adja hozzá a HTML link címkéket a <head> szakaszhoz, amelyek az egyes fájlhelyekre mutatnak.
Miért nem frissül a kedvenc ikonom a böngészőben?
A böngészők agresszíven gyorsítótárazzák a kedvenceket. Törölje a böngésző gyorsítótárát, próbálja meg megnyitni inkognitóablakban, vagy adjon hozzá egy verziólekérdezési karakterláncot (?v=2) a favicon URL-hez a frissítés kényszerítéséhez.
Miért nem frissül a kedvencem?
A böngészők agresszíven gyorsítótárazzák a kedvenc ikonokat, néha napokig. Kényszerítsen frissítést a gyorsítótár törlésével, az ikon URL-jének közvetlen megnyitásával vagy egy verziólekérdezési paraméter hozzáfűzésével a linkcímkéhez.
Fel van töltve a képem egy szerverre?
Nem. A generálás a böngészőjében történik.
SVG-t vagy PNG-t használjak?
SVG a forráshoz (felbontástól független). A generátor meghatározott méretű PNG-ket ad ki; a modern böngészők az SVG faviconokat is támogatják a rel=icon type=image/svg+xml linken keresztül.
Mi az a site.webmanifest?
JSON-jegyzék a progresszív webalkalmazásokhoz, amely ikonokat, színeket és egyéb metaadatokat ír le. Telepíthető webalkalmazásokhoz szükséges; ártalmatlan még a szabványos webhelyeken is.