Apple touch icon-generator

Skapa den 180×180 apple-touch-icon som iOS använder för bokmärken på hemskärmen — plus en komplett favicon-uppsättning — lokalt i din webbläsare. Inget laddas upp.

Integritet först: varje bild bearbetas lokalt i din webbläsare. Ingenting laddas upp, lagras eller överförs till någon server.

Ikonen som iOS lägger på hemskärmen

När någon lägger till din webbplats på hemskärmen på sin iPhone eller iPad letar iOS efter en 180×180 apple-touch-icon; utan en sådan faller det tillbaka på en suddig skärmdump. Den här generatorn renderar exakt den storleken från din bild — med en enfärgad bakgrund, eftersom apple-touch-icons inte bör vara transparenta — och inkluderar den i nedladdningen tillsammans med favicon.ico och Android-ikonerna.

En export, alla plattformar

I stället för att handbeskära en separat fil per enhet genererar du hela uppsättningen på en gång: apple-touch-icon för iOS, PNG-filer i 192 och 512px för Android och PWA:er, och favicon.ico för skrivbordswebbläsare, med en HTML-kodsnutt som refererar till dem. Allt körs i din webbläsare, så ditt varumärkesmaterial lämnar aldrig din enhet.

Vanliga frågor

Laddas min bild upp för att skapa faviconen?
Nej. Favicon.ico-filen, PNG-ikonerna och manifestet genereras allihop lokalt i din webbläsare med Canvas API. Din bild lämnar aldrig din enhet.
Vilka storlekar och filer får jag?
En favicon.ico i flera upplösningar (16, 32 och 48px), PNG-ikoner i 16, 32, 48, 180 (apple-touch-icon), 192 och 512px, en site.webmanifest och ett HTML-utdrag att klistra in i din <head>.
Kan jag konvertera en PNG eller SVG till en ICO?
Ja. Släpp in en PNG, JPG, SVG eller WebP och ladda ner en riktig favicon.ico. SVG-logotyper rastreras först lokalt i hög upplösning.
Vilken bild fungerar bäst?
En kvadratisk bild med en enkel logotyp med hög kontrast. Bilder som inte är kvadratiska beskärs från mitten så att de passar; använd reglagen för utfyllnad och form för att rama in den som du vill.
Hur installerar jag faviconen?
Packa upp paketet i din webbplats rotmapp och klistra in det medföljande HTML-utdraget i <head> på dina sidor. Favicon.ico-filen hittas automatiskt av de flesta webbläsare.