Konvertera SVG till ikon

Q: Vad är skillnaden mellan den här sidan och SVG till ICO?

[SVG till ICO](/svg-to-ico) fokuserar på den enskilda .ico-filen för favicons och Windows. Den här sidan täcker alla platser där en ikon behövs, inklusive ICNS för macOS och de PNG-bilder i fasta storlekar som Android, iOS och appbutiker kräver.

En enda vektorlogga räcker till alla ikonplatser du har: en favicon, en genväg i Windows, en Mac-app och startikonerna i mobilen. Sidan börjar på en ICO med flera storlekar och du kan byta till ICNS eller PNG för de andra plattformarna.

eller släpp JPG, JPEG, JPE …-filer här ·

Max 95 MB per fil· Upp till 20 filer· Raderas efter 30 minuter

Utdata

Konvertera till

Filerna bearbetas på våra servrar och raderas efter 30 minuter.

Så använder du verktyget

1
Ladda upp en kvadratisk SVG
Lägg till SVG-filen med din logotyp, helst med en kvadratisk viewBox. Du kan lägga till upp till 20 filer samtidigt, till exempel en ljus och en mörk variant.
2
Välj ikonformat
ICO med Ikonstorlekar inställt på Alla storlekar (16–256) är förvalt. Välj ICNS under Konvertera till för macOS, eller PNG med en bredd under Ändra storlek på bilden för en mobil- eller butiksikon.
3
Konvertera och placera filerna
Klicka på Konvertera till ICO (texten följer det format du valt), ladda ner och lägg varje fil där plattformen förväntar sig den.

Det finns inget enskilt ikonformat. Windows och webbläsare använder ICO, macOS använder ICNS och mobiler använder uppsättningar av PNG-filer. När du utgår från SVG ritas varje ikon på nytt från vektorn, skarp i varje storlek.

SVG till ikon: en vektor, tre sorters ikonfiler

En ikonfil är en behållare med små bitmappar, inte en vektor. Operativsystemet väljer den bitmapp som ligger närmast den storlek det behöver, så en bra ikon har flera, var och en renderad för sitt eget rutnät.

ICO-förvalet på den här sidan skriver en fil med alla storlekar från 16 till 256 px, vilket täcker favicon.ico och genvägar i Windows. Byt Konvertera till till ICNS för en ikonbehållare från Apple, eller till PNG för de enskilda storlekar som Android, iOS och appbutiker kräver.

Tabellen visar vad de stora plattformarna publicerar för sina ikonplatser.

Ikonfiler som varje plattform förväntar sig
Organisation	Krav	Källa
Windows skrivbord och aktivitetsfält	ICO med flera storlekar, inklusive 16, 32, 48 och 256 px	—
Webbplatsens favicon	favicon.ico i webbplatsens rot med 16, 32 och 48 px; en PNG på 180 × 180 px för apple-touch-icon	—
Appikon för macOS	ICNS eller Xcode-resurskatalog, storlekar upp till 1024 × 1024 px	—
Google Play-butikens sida	512 × 512 px 32-bitars PNG, högst 1 024 KB	—
Apple App Store	1024 × 1024 px PNG utan transparens	—

SVG

Scalable Vector Graphics

SVG är ett XML-baserat vektorformat som W3C standardiserade 2001. I stället för pixlar beskriver det former, banor och text, så det förblir skarpt i alla storlekar och är oftast mycket litet för logotyper och ikoner. Det stöder transparens, CSS-formatering, skript och animation, och alla webbläsare återger det direkt. SVG lämpar sig inte för foton, och komplexa illustrationer kan bli långsamma att rendera. Illustrator, Inkscape, Figma och webbläsare kan öppna och redigera det.

Komprimering: –
Transparens: Ja
Animation: Ja
Introducerades: 2001 · W3C

SVG-omvandlare

ICO

Windows-ikon

ICO är Microsofts ikonformat som används för programikoner i Windows och favicons på webbplatser. En .ico-fil kan innehålla flera bilder i olika storlekar, till exempel 16×16, 32×32, 48×48 och 256×256 pixlar, så att systemet kan välja den som passar bäst. Varje bild kan lagras som bitmapp eller som PNG-data och stöder full alfatransparens. ICO är inte avsett för foton eller stora illustrationer. Webbläsare, Windows och de flesta ikonredigerare kan läsa det.

Komprimering: Förlustfri
Transparens: Ja
Animation: Nej
Introducerades: Microsoft

ICO-omvandlare

Folk söker efter SVG till ikon när de har en vektorlogotyp och flera plattformar att tillgodose, var och en med sin egen ikonbehållare, från favicon.ico på en webbplats till ICNS på en Mac och PNG i olika storlekar i appbutiker.

Konvertera SVG till ikonfiler för Windows, Mac, Android och iOS

Behåll ICO och Ikonstorlekar på Alla storlekar. Byt namn på resultatet till favicon.ico för webbplatsens rot, eller peka på filen i dialogrutan Ändra ikon för en Windows-genväg.

En enda .ico fungerar för flikar, bokmärken och aktivitetsfältet
Lägg till en PNG på 180 px för bokmärken på iPhones hemskärm

Så designar du en SVG som håller i 16 px

En ikon på 16 × 16 px har totalt 256 pixlar. De flesta varumärken har ett separat ikonmärke, ofta bara symbolen eller en bokstav, med kraftiga former och få färger. Om ditt inte finns än kan du göra en förenklad kopia av SVG-filen för ikoner.

Kontrollera viewBox före konverteringen. En bred viewBox ger en ikon med tomma band ovanför och under märket, så beskär den till en kvadrat först. Guiden om att beskära en bild till ett bildförhållande går igenom kvadratiska beskärningar, och SVG till PNG ger en snabb stor förhandsvisning för att bedöma designen.

Vanliga frågor om SVG till ikon

Vad är skillnaden mellan den här sidan och SVG till ICO?

SVG till ICO fokuserar på den enskilda .ico-filen för favicons och Windows. Den här sidan täcker alla platser där en ikon behövs, inklusive ICNS för macOS och de PNG-bilder i fasta storlekar som Android, iOS och appbutiker kräver.

Vilket ikonformat använder varje operativsystem?

Windows läser ICO, macOS läser ICNS eller resurskataloger som skapas i Xcode, och Android och iOS använder PNG-bilder i fasta pixelstorlekar.

Kan jag få alla PNG-storlekar till min app i en enda konvertering?

Nej. En PNG innehåller en enda storlek, så varje konvertering ger en bredd. Ställ in Ändra storlek på bilden på en storlek, konvertera, ändra sedan talet och konvertera igen. Varje storlek ritas skarpt från vektorn.

Täcker ICNS-filen från den här sidan Retina-ikoner för Mac?

Den innehåller storlekar från 16 upp till 256 px. Dagens appikoner för macOS har även poster på 512 px och 1024 px för Retina-skärmar, som Xcode eller Apples iconutil bygger från PNG-filer. Exportera de två storlekarna som PNG här och lägg till dem i uppsättningen.

Ska ikonen ha transparent bakgrund?

För ICO, ICNS och Androids ikonlager, ja: med transparens kan systemet rita sin egen bakgrund. Ikonen för iOS App Store är undantaget. Apple avvisar en marknadsföringsikon på 1024 px med alfakanal, så ge den PNG-filen en solid bakgrund i SVG-filen.

Varför blir min detaljerade logga en klump som liten ikon?

Vid 16 eller 32 px finns det inte plats för tunna linjer eller liten text. Gör linjerna tjockare så att de täcker minst en hel pixel i den minsta storleken, och ta bort ordmärket.