PNG konvertálása ICO-ba (favicon)

A favicon az a kis ikon, amelyet a böngészők a fülön, a könyvjelzősávon és az előzményekben mutatnak. Ez az eszköz egy PNG képet szabályos, többméretes .ico fájllá alakít 16, 32, 48 és 64 pixeles változatokkal, és mindezt az eszközödön készíti el, feltöltés nélkül.

Hogyan konvertálj PNG-t ICO-ba

Húzd be a PNG képedet az alábbi eszközbe. A négyzet alakú kép működik a legjobban.
A kimeneti formátum már be van állítva: ICO (favicon).
Kattints az Indítás gombra a többméretes .ico elkészítéséhez.
Töltsd le a favicon.ico fájlt, és tedd a weboldalad gyökérmappájába.

Mire kell képesnek lennie egy faviconnak

A favicon apró méretben jelenik meg, gyakran mindössze 16 képpontos négyzetként. Ekkora méretben a finom részletek eltűnnek, a vékony vonalak pedig teljesen elvesznek. A jó favicon egy határozott, egyszerű, erős kontrasztú forma: egyetlen betű, a logójel leegyszerűsített változata, vagy egy tömör forma a márka színében. Ha a teljes logód szöveget tartalmaz, csak a jelet használd, vagy csak a kezdőbetűt.

Az .ico fájlok azért tartalmaznak több méretet, mert ha egyetlen képet nagyítanak vagy kicsinyítenek megjelenítéskor, az elmosódottnak látszik. Ha 16, 32, 48 és 64 képpontos változatot is adsz, az operációs rendszer vagy a böngésző minden helyzetben képpontpontos képet jeleníthet meg: 16 px a lapon, 32 px a könyvjelzősávban nagy pixelsűrűségű kijelzőn, 48 px a Windows tálcáján lévő parancsikonban, és így tovább.

A forrás PNG előkészítése

Legyen négyzetes. Ha a logód széles, előbb helyezd egy négyzetes, átlátszó vászonra, vagy vágd le a jelre a vágóeszközzel.
Kezdj legalább 256 képpontról. Egy nagy, tiszta forrásból kicsinyítve simább eredményt kapsz, mint egy kicsi kép nagyításával.
Tartsd meg az átlátszó hátteret, ha a forma tömör, így a böngésző világos és sötét témáján is jól mutat. Ha a forma vékony vagy halvány színű, inkább egy egyszínű négyzetre tedd.
Kerüld az egy-két betűnél hosszabb szöveget; 16 képpontban nem lesz olvasható.

A favicon telepítése

Mentsd a letöltött fájlt favicon.ico néven, és tedd a weboldalad gyökérmappájába. Ezután add hozzá ezt minden oldal <head> részéhez:

<link rel="icon" href="/favicon.ico" sizes="any">

A legtöbb platformon erre külön beállítás van: a WordPressben ez a Site Icon (webhelyikon) a Megjelenés menüben, a Shopify és a Squarespace téma-beállításaiban Favicon mező található, a Webflow-ban pedig a Project Settings alatt van ilyen. Ott töltsd fel az .ico fájlt. A teljes útmutatóért olvasd el a hogyan készíts favicont cikket.

Továbblépés

A modern eszközök által kért teljes ikonkészlethez szükséged lesz egy 180 képpontos PNG-re is az iOS kezdőképernyős parancsikonjaihoz (apple-touch-icon), valamint 192 és 512 képpontos PNG-kre az Androidhoz és a webalkalmazás-manifesthez. Ezek egyszerű PNG fájlok, ezért az átméretező eszközzel készítsd el őket ugyanabból a mesterpéldányból. Az ezen az oldalon készült .ico a böngészőlapokat, a könyvjelzőket és a Windowst fedi le, vagyis azokat a helyeket, ahol a legtöbben észreveszik a hiányzó favicont.

Gyakran ismételt kérdések

Mekkora legyen az eredeti PNG képem?

Négyzet alakú, és legalább 64 × 64 pixeles. Egy 256 pixeles négyzetes PNG adja a legtisztább eredményt a kicsinyítés után. A nem négyzetes képek középre kerülnek, és átlátszó kitöltést kapnak.

Mi van a .ico fájlban?

Négy PNG kódolású kép 16, 32, 48 és 64 pixeles méretben. A böngészők és a Windows az adott helyzethez legjobban illő méretet választják, így az ikon élesen jelenik meg a fülön, a könyvjelzőkben és az asztali parancsikonon is.

Hogyan adom hozzá a favicont a weboldalamhoz?

Töltsd fel a favicon.ico fájlt a weboldalad gyökérmappájába (hogy elérhető legyen a weboldalad.hu/favicon.ico címen), és tedd be a <link rel="icon" href="/favicon.ico"> sort az oldalaid <head> részébe. A böngészők makacsul gyorsítótárazzák a faviconokat, ezért a változás megjelenéséhez lehet, hogy kényszerített frissítés kell.

Szükségem van még .ico fájlra 2026-ban?

A modern böngészők támogatják a PNG és SVG faviconokat, de az .ico az egyetlen formátum, amely mindenhol működik, beleértve a régebbi böngészőket, a Windows parancsikonokat és egyes hírolvasókat. A legtöbb weboldal mindkettőt kínálja.

A fájljaid soha nem hagyják el az eszközödet

A Squishly Tools minden eszköze 100% ingyenes, és teljes egészében a böngésződben fut. A képeidet és dokumentumaidat a saját számítógéped dolgozza fel, és soha nem kerülnek fel szerverre. Nincs fiók, nincs vízjel, és nincs apró betűs rész.