Pretvaranje PNG u ICO (favicon)

Favicon je mala ikona koju preglednici prikazuju na kartici, traci oznaka i u povijesti. Ovaj alat pretvara PNG u pravu .ico datoteku s više veličina, s verzijama od 16, 32, 48 i 64 piksela, izrađenu u potpunosti na vašem uređaju bez ikakvog prijenosa.

Kako pretvoriti PNG u ICO

Ispustite svoju PNG sliku u alat ispod. Najbolje radi kvadratna slika.
Izlazni format već je postavljen na ICO (favicon).
Kliknite Pokreni kako biste izradili .ico s više veličina.
Preuzmite svoj favicon.ico i stavite ga u korijensku mapu web-stranice.

Što favicon mora postići

Favicon se prikazuje u vrlo malim veličinama, često 16 sa 16 piksela. Pri toj veličini sitni detalji nestaju, a tanke linije potpuno iščeznu. Dobar favicon je izražajan, jednostavan oblik s jakim kontrastom: jedno slovo, pojednostavljena verzija znaka iz logotipa ili puni oblik u boji brenda. Ako vaš puni logotip sadrži ispisani naziv, koristite samo znak ili samo početno slovo.

.ico datoteke sadrže nekoliko veličina zato što povećavanje ili smanjivanje jedne slike pri prikazu izgleda mutno. Uz verzije od 16, 32, 48 i 64 piksela operacijski sustav ili preglednik u svakom kontekstu može prikazati sliku točnu do piksela: 16 px na kartici, 32 px u popisu oznaka na zaslonu visoke razlučivosti, 48 px u prečacu na programskoj traci Windowsa i tako dalje.

Priprema izvornog PNG-a

Neka bude kvadratan. Ako je vaš logotip širok, najprije ga postavite na kvadratno prozirno platno ili ga alatom za obrezivanje obrežite na sam znak.
Krenite od 256 piksela ili više. Smanjivanje iz velikog, čistog izvornika daje glađe rezultate od povećavanja malog.
Zadržite prozirnu pozadinu ako je oblik pun, kako bi dobro izgledao i na svijetlim i na tamnim temama preglednika. Ako je oblik tanak ili svijetle boje, umjesto toga ga stavite na kvadrat pune boje.
Izbjegavajte tekst dulji od jednog ili dva znaka; pri 16 piksela bit će nečitljiv.

Postavljanje favicona

Preuzetu datoteku spremite kao favicon.ico i stavite je u korijensku mapu svoje web stranice. Zatim ovo dodajte unutar elementa <head> na svakoj stranici:

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

Većina platformi umjesto toga ima posebnu postavku: WordPress je naziva Site Icon pod Appearance, Shopify i Squarespace imaju polje Favicon u postavkama teme, a Webflow ga ima u Project Settings. Ondje prenesite .ico. Za potpune upute pročitajte vodič kako izraditi favicon.

Korak dalje

Za cijeli skup ikona koje moderni uređaji traže trebat će vam i PNG od 180 piksela za prečace na početnom zaslonu iOS-a (apple-touch-icon) te PNG datoteke od 192 i 512 piksela za Android i manifest web aplikacije. To su obične PNG datoteke, pa ih izradite iz iste glavne verzije alatom za promjenu veličine. .ico s ove stranice pokriva kartice preglednika, oznake i Windows, a upravo tamo većina ljudi primijeti da favicon nedostaje.

Česta pitanja

Koliko velik treba biti izvorni PNG?

Kvadratan i najmanje 64 × 64 piksela. Kvadratni PNG od 256 piksela daje najčišće smanjene rezultate. Slike koje nisu kvadratne centriraju se i dopunjuju prozirnim prostorom.

Što se nalazi u .ico datoteci?

Četiri slike kodirane kao PNG, veličine 16, 32, 48 i 64 piksela. Preglednici i Windows biraju veličinu koja najbolje odgovara kontekstu, pa ikona izgleda oštro na kartici, u oznakama i na prečacu na radnoj površini.

Kako dodati favicon na web-stranicu?

Prenesite favicon.ico u korijensku mapu web-stranice (tako da bude dostupan na vasastranica.hr/favicon.ico) i dodajte <link rel="icon" href="/favicon.ico"> unutar <head> dijela svojih stranica. Preglednici favicone uporno čuvaju u predmemoriji, pa će možda trebati prisilno osvježavanje da vidite promjenu.

Treba li mi .ico datoteka i 2026. godine?

Moderni preglednici prihvaćaju PNG i SVG favicone, ali .ico je jedini format koji radi svugdje, uključujući starije preglednike, prečace u sustavu Windows i neke čitače feedova. Većina stranica nudi oba.

Vaše datoteke nikada ne napuštaju vaš uređaj

Svaki alat na Squishly Tools 100 % je besplatan i radi u potpunosti unutar vašeg preglednika. Vaše slike i dokumenti obrađuju se na vašem računalu i nikada se ne učitavaju na poslužitelj. Nema računa, nema vodenih žigova i nema skrivenih uvjeta.