Kako napraviti favicon iz logotipa.

Favicon je vaš logo u najmanjoj veličini. Evo kako da bude jasan na 16 piksela.

Isprobajte besplatni alat Rezervirajte 15 minuta

Nemojte samo smanjiti cijeli logo. Uzmite njegov najjednostavniji dio, kao simbol ili početno slovo, stavite ga na kvadrat i napravite ga dovoljno debelim da se čita na 16 x 16 piksela.

Zatim izvezite mali set datoteka: SVG ikonu, ICO ili PNG od 32 piksela, Apple touch ikonu od 180 piksela i ikone od 192 i 512 piksela. Kod i provjera su ispod.

Autor Vedran Obradović · Ažurirano 05.11.2026.

Odaberite dio logotipa koji radi u malom.

Na 16 piksela imate oko 256 točaka. Većina logotipa tu ne stane.

Odlično

Simbol

Ako logo ima znak uz ime, uzmite samo znak.

Dobro

Početno slovo

Kod wordmarka uzmite početno slovo i napravite ga debljim nego u logotipu.

Izbjegavajte

Cijeli logo

Ime od 8 slova postane siva crta. Nitko ga ne može pročitati.

Zato dobar logo od starta dolazi s malom verzijom. Pogledajte dizajn wordmarka i logo u vektoru.

Kako napraviti favicon iz logotipa, korak po korak.

1. Krenite od vektorske datoteke. Koristite SVG ili AI datoteku, nikad snimku ekrana. Mutan početak daje mutnu ikonu.

2. Stavite simbol na kvadrat. Koristite platno od 512 x 512 piksela. Ostavite malo prostora sa svake strane, da ne dodiruje rub.

3. Odaberite pozadinu. Puna boja brenda radi na svijetlim i tamnim karticama preglednika. Prozirna ikona može nestati na tamnoj kartici.

4. Podebljajte je. Tanke linije nestanu u malim veličinama. Podebljajte linije i maknite sitne detalje.

5. Pogledajte je na 16 piksela. Smanjite pogled do prave veličine. Ako morate žmiriti, pojednostavite opet.

6. Izvezite datoteke iz tablice ispod i dodajte kod na stranicu.

Pravilo zaštitne zone pomaže u koraku 2. Napravite ga besplatnim alatom zaštitna zona logotipa.

Besplatni alat

Dajte ikoni prostora.

Dodajte logo ili simbol, odaberite pravilo i preuzmite vodič. Datoteka ostaje na vašem uređaju. Isto pravilo pomaže da favicon ima rub.

Otvori cijeli alat: Logo clear space generator

Veličine favicona i datoteke koje trebate.

Mali set pokrije preglednike, mobitele i Google.

Datoteka	Veličina	Gdje se vidi
icon.svg	Bilo koja (vektor)	Kartice u modernim preglednicima, oštro u svakoj veličini
favicon.ico ili favicon-32.png	32 x 32	Stariji preglednici i alati koji ne čitaju SVG
apple-touch-icon.png	180 x 180	Početni zaslon na iPhoneu i iPadu
icon-192.png	192 x 192	Početni zaslon na Androidu i web app manifest
icon-512.png	512 x 512	Uvodni zasloni aplikacija i veliki pregledi

Provjereno 5. studenog 2026. na Google Search Centralu: Google traži kvadratni favicon i preporučuje veći od 48 x 48 piksela.

Logo Studio u Brand OS Portalu: prava verzija i veličina za svaki posao.

Brand OS Portal

Dobijte 3 predloška u svom brendu. Besplatno.

Ostavite e-mail. Ručno ih dizajniram i šaljem vam u roku od 48 sati. Ne košta vas ništa.

Kod za favicon koji zalijepite.

Stavite ga u head svake stranice. Developer ili alat za izradu weba to napravi za par minuta.

Kod za favicon

<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

site.webmanifest:
{
  "name": "[Ime tvrtke]",
  "icons": [
    { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
    { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
  ]
}

Radite u Frameru ili Webflowu? Oni imaju polje za favicon u postavkama stranice. Tamo učitajte kvadratnu datoteku. Više o izradi weba u mojoj usluzi web dizajn.

Kako da se favicon pokaže u Googleu.

Google pokazuje favicon uz vaš rezultat. Ima par pravila.

Ikona je kvadratna
Veća je od 48 x 48 piksela
Link tag stoji na naslovnoj stranici
Google može pročitati naslovnu stranicu i datoteku ikone
Adresa ikone se ne mijenja često
Ikona predstavlja vaš brend

Google kaže da promjena može trajati od nekoliko dana do nekoliko tjedana. Jasna ikona u pretrazi je sitnica koja vas čini stvarnima. To je dio toga da vas lako nađu i ljudi i AI, pogledajte kako B2B brendovi dobivaju AI preporuke.

Vaša checklista za favicon.

Označite što je točno. Oznake ostaju na ovom uređaju.

Napravljen iz vektorskog logotipa, ne iz snimke ekrana
Koristi simbol ili jedno slovo, ne cijelo ime
Čita se na 16 x 16 piksela
Radi na svijetlim i tamnim karticama
Izvezen SVG i rezerva od 32 piksela
Apple touch ikona od 180 x 180
Ikone od 192 i 512 piksela u manifestu
Kod je u headu svake stranice
Ista ikona je na LinkedInu i u potpisu maila

0 od 9 gotovo

MTG

Brand OS Pro Portal. Tim sam radi svoje objave. Bez čekanja.

Deepsea Networks

Brand OS Core Portal. Direktor napiše i složi LinkedIn objavu u brendu za oko 3 minute.

Trebate logo koji radi u svakoj veličini? Pogledajte moju uslugu dizajn logotipa. Izrada logotipa traje 7-14 dana. Pravila za upotrebu znaka su u tekstu pravila korištenja logotipa.

Logo Studio

Isprobajte jedan alat iz Brand OS Portala

Prava datoteka logotipa za svaki posao.

Ovo je pravi alat iz pravog Brand OS Portala, na brendu MTG. Odaberite posao, portal vam da pravu verziju i veličinu.

Brand OS Portal

Isprobajte još alata iz Brand OS Portala.

Logo Studio, Motion Posts, Pattern Lab, Social Studio i LinkedIn naslovnice. Pravi alati na pravom brendu. Bez e-maila.

Isprobajte još alata

Kratki odgovori.

Koje veličine treba biti favicon?

Napravite glavnu datoteku od 512 piksela. Izvezite SVG, ICO ili PNG od 32 piksela, Apple touch ikonu od 180 piksela i ikone od 192 i 512 piksela.

Mogu li koristiti cijeli logo kao favicon?

Samo ako je jednostavan simbol. Cijelo ime se na 16 piksela ne može pročitati. Uzmite simbol ili početno slovo.

Treba li favicon imati prozirnu pozadinu?

Može, ali puna boja brenda je sigurnija. Prozirna tamna ikona može nestati na tamnoj kartici preglednika.

Zašto se moj favicon ne vidi u Googleu?

Provjerite je li kvadratan, veći od 48 piksela, povezan s naslovne stranice i dostupan Googleu. Onda pričekajte, Googleu treba od nekoliko dana do nekoliko tjedana.

Je li SVG dobar za favicon?

Da, moderni preglednici pokazuju SVG favicon oštro u svakoj veličini. Kao rezervu zadržite ICO ili PNG od 32 piksela.