Muunna kuva faviconiksi

Muuta valokuva tai logo täydeksi favicon-sarjaksi — favicon.ico, apple-touch-icon ja verkkosovellusten PNG-kuvat — suoraan selaimessasi, ilman että mitään ladataan palvelimelle.

Yksityisyys edellä: jokainen kuva käsitellään paikallisesti selaimessasi. Mitään ei ladata palvelimelle, tallenneta tai lähetetä minnekään.

Yhdestä kuvasta koko sarjaan

Pudota mukaan mikä tahansa kuva ja saat takaisin jokaisen kuvakkeen, jota sivusto tarvitsee: monikokoisen favicon.ico-tiedoston välilehtiin, 180-pikselisen apple-touch-iconin iOS:lle, 192- ja 512-pikseliset PNG-kuvat Androidille ja PWA-sovelluksille, verkkomanifestin sekä HTML:n niiden kytkemiseen. Ei-neliömäiset kuvat rajataan keskeltä sopimaan, ja muodon, täytteen ja taustan säätimillä kehystät lopputuloksen.

Yksityinen suunnittelultaan

Favicon-sivustot lataavat yleensä kuvasi palvelimelle ennen kuin palauttavat mitään. Täällä koko sarja luodaan omalla laitteellasi Canvas API:n avulla, joten logoasi ei koskaan lähetetä, tallenneta eikä kirjata lokiin. Se on välitöntä, toimii offline-tilassa kun sivu on kerran ladattu, ja lataamasi tiedostot ovat tarkalleen ne, jotka selaimesi tuotti.

Usein kysytyt kysymykset

Ladataanko kuvani palvelimelle faviconin tekemiseksi?
Ei. favicon.ico, PNG-kuvakkeet ja manifesti luodaan kaikki paikallisesti selaimessasi Canvas API:n avulla. Kuvasi ei koskaan poistu laitteeltasi.
Mitä kokoja ja tiedostoja saan?
Monitarkkuuksisen favicon.ico-tiedoston (16, 32 ja 48 px), PNG-kuvakkeet kokoina 16, 32, 48, 180 (apple-touch-icon), 192 ja 512 px, site.webmanifest-tiedoston sekä HTML-pätkän liitettäväksi <head>-osioon.
Voinko muuntaa PNG:n tai SVG:n ICO-muotoon?
Kyllä. Pudota mukaan PNG, JPG, SVG tai WebP ja lataa aito favicon.ico. SVG-logot rasteroidaan ensin paikallisesti suurella tarkkuudella.
Millainen kuva toimii parhaiten?
Neliömäinen kuva, jossa on yksinkertainen ja korkeakontrastinen logo. Muun kuin neliön muotoiset kuvat rajataan keskeltä sopiviksi; käytä täyte- ja muotosäätimiä sommitellaksesi sen haluamallasi tavalla.
Miten asennan faviconin?
Pura paketti sivustosi juurikansioon ja liitä mukana tuleva HTML-pätkä sivujesi <head>-osioon. Useimmat selaimet löytävät favicon.ico-tiedoston automaattisesti.