Millises pildivormingus peaksin üles laadima?

Läbipaistva taustaga PNG töötab kõige paremini. Kasutage ruudukujulist pilti, mille suurus on vähemalt 512 x 512 pikslit, et tööriist saaks kvaliteedi kadumiseta vähendada. SVG töötab ka hästi, kuna seda saab skaleerida igale suurusele.

Milliseid suurusi see tekitab?

16x16 (brauseri vahekaart), 32x32 (brauseri vahekaart @2x), 48x48 (Windowsi tegumiriba), 180x180 (Apple Touchi ikoon), 192x192 (Androidi avaekraan), 512x512 (PWA pritsekraan). ICO-faili suurus on 16, 32 ja 48 pikslit.

Kuhu ma faviconi failid panen?

Asetage favicon.ico oma veebisaidi juurkataloogi. Muud PNG-suurused lähevad teie avalikku kausta või mis tahes juurdepääsetavale teele. Lisage jaotisesse HTML-i lingisildid, mis osutavad igale faili asukohale.

Miks mu favicon ei värskenda brauseris?

Brauserid salvestavad lemmikuid agressiivselt vahemällu. Tühjendage brauseri vahemälu, proovige avada inkognito aknas või lisage värskenduse sundimiseks faviconi URL-ile versioonipäringu string (?v=2).

Miks mu faviconi ei värskendata?

Brauserid salvestavad faviconid agressiivselt vahemällu, mõnikord päevadeks. Värskenduse sundimiseks tühjendage vahemälu, avage otse ikooni URL või lisage lingimärgendile versioonipäringu parameeter.

Kas mu pilt on serverisse üles laaditud?

Ei. Loomine toimub teie brauseris.

Kas ma peaksin kasutama SVG-d või PNG-d?

SVG allika jaoks (eraldusvõimest sõltumatu). Generaator väljastab kindla suurusega PNG-sid; modern browsers also support SVG favicons via link rel=icon type=image/svg+xml.

Mis on site.webmanifest?

A JSON manifest for progressive web apps describing icons, colors, and other metadata. Nõutav installitavate veebirakenduste jaoks; kahjutu lisada isegi tavalistele saitidele.

Tasuta konverter

Favicon Generaator

Looge mis tahes pildilt mitmes suuruses (16x16 kuni 512x512) faviconifaile. Tasuta, kohene ja töötab täielikult teie brauseris.

Lohistage pilt siia

Toetab PNG, JPG, SVG, WebP. Max 10 MB.

Või

Sellest tööriistast

Favicon on väike ikoon, mis kuvatakse brauseri vahekaartidel, järjehoidjates ja ajalooloendites. Algne favicon - 16 × 16 ICO-fail aadressil /favicon.ico - on laienenud erinevatele platvormidele erineva suurusega ikoonide kompleksiks: 16 × 16 ja 32 × 32 brauseri vahekaartide jaoks, 180 × 180 iOS-i avaekraanide jaoks, 192 × 192 ja 512 × 512 Androidi jaoks. Kaasaegne faviconi generaator teeb seda kõike ühest lähtepildist.

See tööriist võtab ühe kõrge eraldusvõimega lähtepildi (tavaliselt ruudukujulise logo) ja loob täieliku faviconi varade komplekti ja neile viitamiseks vajalikud HTML-lingi märgendid. Väljund sisaldab ICO-d, mitut PNG-d ja manifest.jsoni progressiivse veebirakenduse metaandmete jaoks. Pukseerige saadud failid oma saidi juurtesse ja viidake neile loodud HTML-i kaudu.

Kogu töötlemine toimub teie brauseris. Pole üleslaadimist, API kõnet ega kiiruspiirangut. Väljund töötab igas moodsas brauseris ja operatsioonisüsteemis, mis kuvab lemmikuid.

Miks luua Favicon?

Faviconita saidid näevad välja lõpetamata. Brauseri vahekaardid näitavad üldist ikooni; järjehoidjatel puudub visuaalne identifikaator; sait tundub vähem professionaalne. Korraliku faviconi komplekti lisamine on vähese vaevaga ja suure mõjuga poleerimisaste, mis annab märku detailidele tähelepanu pööramisest.

Kaasaegsed faviconi nõuded on kasvanud kaugemale kui /favicon.ico. iOS-i avaekraani ikoonid, Android Chrome'i ikoonid, Windowsi paaniikoonid ja tumeda režiimi variandid kasutavad erinevaid faile. Nende kõigi ühest allikast genereerimine tagab järjepideva kaubamärgi loomise ilma iga faili käsitsi haldamiseta.

Kuidas kasutada

Laadige üles lähtepilt, hankige täielik faviconi komplekt.

Laadige üles lähtepilt: Kasutage ruudukujulist pilti, mille suurus on vähemalt 512 × 512 pikslit. Eelistatud on PNG (läbipaistvuse tugi); Aktsepteeritakse ka SVG-d. Kõrgema eraldusvõimega allikad toodavad teravamaid väiksemaid ikoone.
Konfigureerige platvormi valikud: Vajadusel lubage iOS, Android, Windows ja PWA väljundid. Vaikesätted loovad standardkomplekti, mida enamik saite vajab.
Kohandage värve ja teemat: Valige Windowsi plaatide ja PWA pritsekraanide teemavärvid. Sobitage oma brändi identiteet.
Laadige alla ja juurutage: Salvestage loodud zip. Asetage failid oma saidi juurtesse ja lisage loodud HTML-i lingisildid oma <head>-sse. HTML viitab igale ikoonile õiges suuruses.

Levinud kasutusjuhtumid

Faviconi lisamine uutele veebisaitidele — Iga uus sait vajab täielikku faviconi komplekti. Generation toodab seda ühest logoallikast.
Aegunud lemmikute värskendamine — Vanematel saitidel on sageli lihtsalt /favicon.ico; kaasaegsed nõuded vajavad täielikumat komplekti. Puuduvate varade taasloomine.
PWA ikoonide tootmine — Progressiivsed veebirakendused vajavad 192 × 192 ja 512 × 512 ikoone ning manifesti metaandmeid. Generaator toodab neid õigesti.
Brändingu vahel üleminek — Rebrändid nõuavad sageli kõigi faviconide taastamist. Ühe allika genereerimine hoiab ära varade kadumise.
Testimine erinevate värvidega — Teema värvide kiire itereerimine ja koheselt näha, kuidas ikoonikomplekt erinevates suurustes välja näeb.

Tehnilised üksikasjad

Täielik kaasaegne faviconi komplekt: favicon.ico (16+32+48 mitme eraldusvõimega), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android-chrome-51-51. mstile-150x150.png. Lisaks site.webmanifest PWA jaoks, browserconfig.xml Windowsi jaoks.

Iga PNG genereeritakse allikast lõuendipõhise alladiskreetmise teel. ICO on konstrueeritud JavaScriptis, kombineerides 16/32/48 versioonid mitme eraldusvõimega ICO-vormingusse, kasutades DataView kirjutisi.

HTML-i lingisildid viitavad igale failile sobivate atribuutidega rel ja sizes. Generaator loob need teie saidi <head> jaoks kopeerimis-kleepimisvalmis koodilõiguna.

Parimad tavad

Kasutage kõrge eraldusvõimega allikat — Alustage vähemalt 512 × 512 PNG- või SVG-meistriga. Alladiskreetimine annab teravamad väiksemad ikoonid kui väikese allika ülesskaleerimine.
Testige mitmes brauseris — Erinevad brauserid ja platvormid kuvavad erinevaid ikoone. Avage juurutatud sait Chrome'is, Safaris, Firefoxis, mobiilses Safaris ja Android Chrome'is, et kinnitada, et igaüks valib õige vara.
Sobitage värvid oma kaubamärgiga — Teemavärvid ja PWA pritsekraanid peaksid peegeldama teie kaubamärgi identiteeti. Ebaühtlased värvid annavad poleeritud välimusega ikooni, mille süsteemiintegratsioon ei sobi.
Hoidke lähtetekst SVG edaspidiseks taastamiseks — Kui muudate kaubamärki, taastute allikast. Hoidke põhi-SVG (või kõrgeima eraldusvõimega PNG) juurdepääsetav.

Korduma kippuvad küsimused

Millises pildivormingus peaksin üles laadima?: Läbipaistva taustaga PNG töötab kõige paremini. Kasutage ruudukujulist pilti, mille suurus on vähemalt 512 x 512 pikslit, et tööriist saaks kvaliteedi kadumiseta vähendada. SVG töötab ka hästi, kuna seda saab skaleerida igale suurusele.
Milliseid suurusi see tekitab?: 16x16 (brauseri vahekaart), 32x32 (brauseri vahekaart @2x), 48x48 (Windowsi tegumiriba), 180x180 (Apple Touchi ikoon), 192x192 (Androidi avaekraan), 512x512 (PWA pritsekraan). ICO-faili suurus on 16, 32 ja 48 pikslit.
Kuhu ma faviconi failid panen?: Asetage favicon.ico oma veebisaidi juurkataloogi. Muud PNG-suurused lähevad teie avalikku kausta või mis tahes juurdepääsetavale teele. Lisage jaotisesse <head> HTML-i lingisildid, mis osutavad igale faili asukohale.
Miks mu favicon ei värskenda brauseris?: Brauserid salvestavad lemmikuid agressiivselt vahemällu. Tühjendage brauseri vahemälu, proovige avada inkognito aknas või lisage värskenduse sundimiseks faviconi URL-ile versioonipäringu string (?v=2).
Miks mu faviconi ei värskendata?: Brauserid salvestavad faviconid agressiivselt vahemällu, mõnikord päevadeks. Värskenduse sundimiseks tühjendage vahemälu, avage otse ikooni URL või lisage lingimärgendile versioonipäringu parameeter.
Kas mu pilt on serverisse üles laaditud?: Ei. Loomine toimub teie brauseris.
Kas ma peaksin kasutama SVG-d või PNG-d?: SVG allika jaoks (eraldusvõimest sõltumatu). Generaator väljastab kindla suurusega PNG-sid; modern browsers also support SVG favicons via link rel=icon type=image/svg+xml.
Mis on site.webmanifest?: A JSON manifest for progressive web apps describing icons, colors, and other metadata. Nõutav installitavate veebirakenduste jaoks; kahjutu lisada isegi tavalistele saitidele.

Favicon Generaator

Lohistage pilt siia

Seotud tööriistad

Rakenduse ikoon Generaator

Brauseri raam Maketi generaator

Seadme makett Generaator

Meem Generaator

Sellest tööriistast

Miks luua Favicon?

Kuidas kasutada

Levinud kasutusjuhtumid

Tehnilised üksikasjad

Parimad tavad

Korduma kippuvad küsimused

Related Articles

Image Format Guide: JPG vs PNG vs WebP vs SVG Explained

Color & Design Tools Guide: Hex, RGB, HSL, and Color Palettes Explained

How to Convert Files Online Safely: Privacy and Security Guide

Why Browser-Based Tools Are the Future: No Installs, No Uploads, No Risk