ByBence Tools · Weboldal
Favicon generátor
Tölts fel egy logót vagy ikont, finomhangold ugyanazzal a Color Pickerrel, mint a többi ByBence színes eszközben, majd nézd meg valódi méretekben és környezetekben még a ZIP letöltése előtt.
Tölts fel logót vagy ikont
Húzd ide vagy kattints · PNG, JPG, WebP vagy SVG. Négyzetes, egyszerű grafika adja a legjobb kis méretű eredményt.
Háttérszín
Belső margó · 10%
0–30
Sarokkerekítés · 18%
0–50
Élő favicon preview
Pontosan ezt nézd meg letöltés előtt
A preview itt jelenik meg
Tölts fel egy képet, majd minden módosítást valós időben látsz a célméreteken.
HTML bekötés
<link rel="icon" href="/favicon.ico" sizes="any"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
A megosztás az aktuális preview-t és beállításokat használja.
A csomag ICO, PNG, Apple Touch Icon, Android ikon, manifest és HTML fájlt tartalmaz.
Favicon útmutató
A letöltés előtt lásd, hogyan viselkedik az ikon böngészőfülön, Google-szerű találatban és mobil ikonként.
A favicon készítésnél a legnagyobb hiba az, amikor a forráskép nagyban jól néz ki, de 16×16 pixelen felismerhetetlenné válik. Ezért a generátor most először preview-t készít a tényleges célméretekhez, és csak utána tölthető le a ZIP csomag.
A háttérszín és a belső margó ugyanazzal a Color Picker rendszerrel állítható, mint a többi színes eszközben.
Böngésző
16×16 / 32×32
Tab és könyvjelző.
Apple
180×180
Touch icon.
Android
192 / 512
Manifest ikonok.
Export
ZIP + HTML
Kész fájlstruktúra.
Hogyan használd?
Forráskép
Tölts fel egyszerű, lehetőleg négyzetes logót vagy monogramot.
Keret
Állíts háttérszínt, átlátszóságot és belső margót.
Preview
Ellenőrizd több célméreten és valós UI-környezetben.
ZIP
Csak a jóváhagyott preview után generáld a teljes csomagot.
16×16-on teljesen más szabályok érvényesek
Egy részletes logó vagy hosszú szójel nagy méretben működhet, faviconként viszont összemosódik. A jó favicon erős sziluettet, kevés belső részletet és stabil kontrasztot használ.
A preview azért mutatja külön a 16, 32, 180, 192 és 512 pixeles kimenetet, mert nem elég a nagy ikon alapján dönteni.
Gyenge megoldás
Túl részletes logó
Kicsiben zajos és felismerhetetlen.
—
vékony vonalak
—
sok karakter
—
alacsony kontraszt
Jobb megoldás
Egyszerű monogram
Kis méretben is gyorsan azonosítható.
✓
erős forma
✓
egy fókuszpont
✓
tisztább sziluett
Mi kerül a ZIP-be?
01
favicon.ico
Kompatibilitási fallback.
02
PNG méretek
16×16 és 32×32 böngészős ikonok.
03
Apple / Android
180×180, 192×192 és 512×512.
04
Manifest + HTML
Beilleszthető link elemek és site.webmanifest.
Favicon és keresési megjelenés
A favicon nem klasszikus rangsorolási faktor, de a márka keresési megjelenésének része lehet. Stabil URL, crawlolható erőforrás és egyszerű, négyzetes vizuál segít abban, hogy a kereső megfelelő ikont tudjon felhasználni.
Teszt
Ne csak generáld — nézd meg valódi környezetben.
A ZIP kicsomagolása és bekötése után nyisd meg a webhelyet valódi böngészőfülön, mobilon és könyvjelző nézetben is. A vizuális felismerhetőség többet számít, mint az, hogy technikailag minden fájl létezik.
Gyakori kérdések
Mekkora legyen a favicon?
A böngészők több méretet használnak. A klasszikus 16×16 és 32×32 mellett Apple Touch Iconhoz 180×180, Android/manifest környezethez pedig 192×192 és 512×512 méret is hasznos.
PNG vagy ICO favicon?
Modern böngészők több formátumot támogatnak, az ICO pedig széles kompatibilitású fallback. A generátor mindkettőhöz szükséges fájlokat ad.
Lehet átlátszó a favicon?
Igen. Kapcsold be az átlátszó hátteret; ilyenkor a PNG-k alfa csatornával készülnek. Az előnézet sakktábla háttéren mutatja az átlátszóságot.
A favicon javítja a Google helyezést?
Nem klasszikus rangsorolási faktor, viszont része lehet a keresési megjelenésnek és a márka felismerhetőségének.