Bezmaksas pārveidotājs

Favicon Ģenerators

Ģenerējiet favicon failus vairākos izmēros (16x16 līdz 512x512) no jebkura attēla. Bezmaksas, tūlītēja un pilnībā darbojas jūsu pārlūkprogrammā.

Velciet un nometiet attēlu šeit

Atbalsta PNG, JPG, SVG, WebP. Maksimums 10 MB.

Or

Par šo rīku

Favicon ir maza ikona, kas parādās pārlūkprogrammas cilnēs, grāmatzīmēs un vēstures sarakstos. Sākotnējais favicon — 16 × 16 ICO fails vietnē /favicon.ico — ir paplašinājies par sarežģītu ikonu kopu dažādos izmēros dažādām platformām: 16 × 16 un 32 × 32 pārlūkprogrammas cilnēm, 180 × 180 iOS sākuma ekrāniem, 192 × 192 un 512 × 512 operētājsistēmām Android, kā arī dažāda izmēra ikonas Android ierīcēm. Mūsdienu favicon ģenerators dara to visu no viena avota attēla.

Šis rīks uzņem vienu augstas izšķirtspējas avota attēlu (parasti kvadrātveida logotipu) un ģenerē pilnu favicon līdzekļu kopu, kā arī HTML saišu tagus, kas nepieciešami, lai uz tiem atsauktos. Izvade ietver ICO, vairākus PNG un manifest.json progresīvajiem tīmekļa lietotņu metadatiem. Nometiet iegūtos failus savas vietnes saknē un atsaucieties uz tiem, izmantojot ģenerēto HTML.

Visa apstrāde notiek jūsu pārlūkprogrammā. Nav augšupielādes, nav API izsaukuma, nav ātruma ierobežojuma. Izvade darbojas katrā modernajā pārlūkprogrammā un operētājsistēmā, kas parāda favicons.

Kāpēc ģenerēt Favicon

Vietnes bez faviconiem izskatās nepabeigtas. Pārlūka cilnēs ir redzama vispārīga ikona; grāmatzīmēm nav vizuāla identifikatora; vietne šķiet mazāk profesionāla. Pareiza favicon komplekta pievienošana ir zemas piepūles un augstas ietekmes pulēšanas solis, kas norāda uz detaļām.

Mūsdienu favicon prasības ir izaugušas tālāk par /favicon.ico. iOS sākuma ekrāna ikonas, Android Chrome ikonas, Windows elementu ikonas un tumšā režīma varianti izmanto dažādus failus. To visu ģenerēšana no viena avota nodrošina konsekventu zīmolu veidošanu, nepārvaldot katru failu ar roku.

Kā lietot

Augšupielādējiet avota attēlu, iegūstiet pilnu favicon komplektu.

  1. Augšupielādējiet avota attēlu: Izmantojiet kvadrātveida attēlu, kas ir vismaz 512 × 512 pikseļi. Priekšroka tiek dota PNG (caurredzamības atbalsts); Tiek pieņemts arī SVG. Augstākas izšķirtspējas avoti rada asākas mazākas ikonas.
  2. Konfigurējiet platformas opcijas: Iespējojiet iOS, Android, Windows un PWA izvades pēc vajadzības. Noklusējuma iestatījumi veido standarta kopu, kas nepieciešama lielākajai daļai vietņu.
  3. Pielāgojiet krāsas un motīvu: Izvēlieties motīvu krāsas Windows flīzēm un PWA uzplaiksnījuma ekrāniem. Saskaņojiet savu zīmola identitāti.
  4. Lejupielādējiet un izvietojiet: Saglabājiet izveidoto zip. Novietojiet failus savas vietnes saknē un pievienojiet ģenerētos HTML saišu tagus savai <head>. HTML atsauce uz katru ikonu ir pareizajā izmērā.

Bieži lietojami gadījumi

Tehniskās detaļas

Pilns modernais favicon komplekts: favicon.ico (16+32+48 vairāku izšķirtspēju), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android-x.51-51. mstile-150x150.png. Plus vietne.webmanifest for PWA, browserconfig.xml operētājsistēmai Windows.

Katrs PNG tiek ģenerēts, izmantojot audekla bāzes iztveršanu no avota. ICO ir izveidots JavaScript, apvienojot 16/32/48 versijas vairāku izšķirtspējas ICO formātā, izmantojot DataView rakstīšanu.

HTML saišu tagi atsaucas uz katru failu ar atbilstošiem rel un sizes atribūtiem. Ģenerators tos izveido kā kopēšanai un ielīmēšanai gatavu fragmentu jūsu vietnes <head>.

Labākā prakse

Bieži uzdotie jautājumi

Kādā formātā augšupielādēt attēlu?
Vislabāk darbojas PNG ar caurspīdīgu fonu. Izmantojiet kvadrātveida attēlu, kura izmērs ir vismaz 512 x 512 pikseļi, lai rīks varētu samazināties, nezaudējot kvalitāti. SVG darbojas arī labi, jo to var pielāgot jebkuram izmēram.
Kādus izmērus tas rada?
16x16 (pārlūka cilne), 32x32 (pārlūka cilne @2x), 48x48 (Windows uzdevumjosla), 180x180 (Apple Touch ikona), 192x192 (Android sākuma ekrāns), 512x512 (PWA uzplaiksnījuma ekrāns). ICO failā ir 16, 32 un 48 pikseļi.
Kur es varu ievietot favicon failus?
Ievietojiet favicon.ico savas vietnes saknes direktorijā. Citi PNG izmēri atrodas jūsu publiskajā mapē vai jebkurā pieejamā ceļā. Pievienojiet HTML saišu tagus sadaļā <head>, norādot uz katra faila atrašanās vietu.
Kāpēc mana izlases ikona netiek atjaunināta pārlūkprogrammā?
Pārlūkprogrammas agresīvi kešatmiņā saglabā faviconus. Iztīriet pārlūkprogrammas kešatmiņu, mēģiniet atvērt inkognito logā vai pievienojiet versijas vaicājuma virkni (?v=2) favicon URL, lai piespiestu atsvaidzināt.
Kāpēc mana izlases ikona netiek atjaunināta?
Pārlūkprogrammas agresīvi saglabā faviconus kešatmiņā, dažreiz vairākas dienas. Piespiediet atsvaidzināšanu, notīrot kešatmiņu, tieši atverot ikonas URL vai pievienojot saites tagam versijas vaicājuma parametru.
Vai mans attēls ir augšupielādēts serverī?
Nē. Ģenerēšana notiek jūsu pārlūkprogrammā.
Vai man vajadzētu izmantot SVG vai PNG?
SVG avotam (neatkarīgs no izšķirtspējas). Ģenerators izvada PNG konkrētos izmēros; mūsdienu pārlūkprogrammas atbalsta arī SVG favicons, izmantojot saiti rel=icon type=image/svg+xml.
Kas ir vietne.webmanifest?
JSON manifests progresīvām tīmekļa lietotnēm, kas apraksta ikonas, krāsas un citus metadatus. Nepieciešams instalējamām tīmekļa lietotnēm; nekaitīgi iekļaut pat standarta vietnēs.