UltKit

SVG in Icon umwandeln

Ein einziges Vektorlogo reicht für alle Icon-Plätze: Favicon, Windows-Verknüpfung, Mac-App und die App-Symbole auf dem Smartphone. Diese Seite startet mit einer ICO-Datei in mehreren Größen; für die anderen Plattformen wechseln Sie zu ICNS oder PNG.

Bild-Konverter

oder JPG, JPEG, JPE …-Dateien hierher ziehen ·

Max. 95 MB pro Datei· Bis zu 20 Dateien· Gelöscht nach 30 Minuten

Ausgabe

Dateien werden auf unseren Servern verarbeitet und nach 30 Minuten gelöscht.

So verwenden Sie dieses Tool

  1. 1

    Quadratische SVG hochladen

    Fügen Sie das SVG Ihres Logos hinzu, am besten mit quadratischer viewBox. Sie können bis zu 20 Dateien auf einmal hinzufügen, zum Beispiel eine helle und eine dunkle Variante.

  2. 2

    Icon-Format wählen

    Voreingestellt ist ICO mit Icon-Größen auf „Alle Größen (16–256)“. Wählen Sie unter Umwandeln in ICNS für macOS oder PNG mit einer Breite unter Größe des Ausgabebilds ändern für ein Smartphone- oder Store-Icon.

  3. 3

    Umwandeln und Dateien einbinden

    Klicken Sie auf In ICO konvertieren (die Beschriftung richtet sich nach dem gewählten Format), laden Sie die Datei herunter und legen Sie jede Datei dort ab, wo die jeweilige Plattform sie erwartet.

Es gibt kein einheitliches Icon-Format. Windows und Browser nutzen ICO, macOS nutzt ICNS, und Smartphones verwenden Sets aus PNGs. Mit SVG als Ausgangspunkt wird jede Größe frisch aus dem Vektor gezeichnet und bleibt scharf.

SVG in Icon: ein Vektor, drei Arten von Icon-Dateien

Eine Icon-Datei ist ein Container aus kleinen Bitmaps, keine Vektorgrafik. Das Betriebssystem wählt die Bitmap, die der benötigten Größe am nächsten kommt. Ein gutes Icon enthält daher mehrere, jeweils für ihr eigenes Raster gerendert.

Die ICO-Voreinstellung auf dieser Seite schreibt eine Datei mit allen Größen von 16 bis 256 px, die favicon.ico und Windows-Verknüpfungen abdeckt. Stellen Sie Umwandeln in auf ICNS für einen Apple-Icon-Container oder auf PNG für die einzelnen Größen, die Android, iOS und App-Stores verlangen.

Die Tabelle zeigt, was die großen Plattformen für ihre Icon-Plätze vorgeben.

Welche Icon-Dateien jede Plattform erwartet
OrganisationAnforderungQuelle
Windows-Desktop und TaskleisteICO mit mehreren Größen, darunter 16, 32, 48 und 256 px—
Website-Faviconfavicon.ico im Stammverzeichnis der Website mit 16, 32 und 48 px; ein PNG mit 180 × 180 px für apple-touch-icon—
macOS-App-IconICNS oder Xcode-Asset-Katalog, Größen bis 1024 × 1024 px—
Google-Play-Store-Eintrag32-Bit-PNG mit 512 × 512 px, bis 1.024 KB—
Apple App StorePNG mit 1024 × 1024 px ohne Transparenz—

SVG

Scalable Vector Graphics

SVG ist ein XML-basiertes Vektorformat, das das W3C 2001 standardisiert hat. Statt Pixeln beschreibt es Formen, Pfade und Text, bleibt daher in jeder Größe scharf und ist bei Logos und Icons meist winzig. Es unterstützt Transparenz, CSS-Formatierung, Skripte und Animation, und jeder Browser stellt es nativ dar. Für Fotos ist SVG ungeeignet, und komplexe Illustrationen können langsam rendern. Illustrator, Inkscape, Figma und Browser können es öffnen und bearbeiten.

Komprimierung
–
Transparenz
Ja
Animation
Ja
Eingeführt
2001 · W3C
SVG-Konverter

ICO

Windows-Symbol

ICO ist das Symbolformat von Microsoft, das für Windows-Programmsymbole und Website-Favicons verwendet wird. Eine .ico-Datei kann mehrere Bilder in verschiedenen Größen enthalten, etwa 16×16, 32×32, 48×48 und 256×256 Pixel, damit das System die passendste auswählen kann. Jedes Bild kann als Bitmap oder als PNG-Daten gespeichert werden und unterstützt volle Alpha-Transparenz. ICO ist nicht für Fotos oder große Grafiken gedacht. Browser, Windows und die meisten Symbol-Editoren können es lesen.

Komprimierung
Verlustfrei
Transparenz
Ja
Animation
Nein
Eingeführt
Microsoft
ICO-Konverter

Nach SVG in Icon wird gesucht, wenn ein Vektorlogo mehrere Plattformen bedienen soll, jede mit eigenem Icon-Container, von der favicon.ico auf einer Website über ICNS auf dem Mac bis zu PNGs in festen Größen in App-Stores.

SVG in Icon-Dateien für Windows, Mac, Android und iOS umwandeln

Lassen Sie ICO und Icon-Größen auf „Alle Größen“. Benennen Sie das Ergebnis für das Stammverzeichnis einer Website in favicon.ico um oder wählen Sie es im Dialog „Anderes Symbol“ einer Windows-Verknüpfung aus.

  • Eine .ico genügt für Tabs, Lesezeichen und Taskleiste
  • Ergänzen Sie ein PNG mit 180 px für Lesezeichen auf dem iPhone-Home-Bildschirm

Eine SVG gestalten, die auch bei 16 px funktioniert

Ein Icon mit 16 × 16 px hat insgesamt 256 Pixel. Die meisten Marken pflegen eine eigene Icon-Marke, oft nur das Symbol oder ein Buchstabe, mit kräftigen Formen und wenigen Farben. Falls Ihre noch nicht existiert, erstellen Sie eine vereinfachte Kopie des SVG für Icons.

Prüfen Sie vor der Umwandlung die viewBox. Eine breite viewBox erzeugt ein Icon mit leeren Streifen über und unter der Marke, schneiden Sie sie daher zuerst quadratisch zu. Die Anleitung zum Zuschneiden eines Bildes auf ein Seitenverhältnis behandelt quadratische Ausschnitte, und mit SVG in PNG erhalten Sie schnell eine große Vorschau, um das Design zu beurteilen.

FAQ: SVG in Icon umwandeln

Was unterscheidet diese Seite von SVG in ICO?

SVG in ICO konzentriert sich auf die einzelne .ico-Datei für Favicons und Windows. Diese Seite deckt alle Einsatzorte eines Icons ab, auch macOS-ICNS und die PNGs in festen Größen, die Android, iOS und App-Stores verlangen.

Welches Icon-Format nutzt welches Betriebssystem?

Windows liest ICO, macOS liest ICNS oder in Xcode erstellte Asset-Kataloge, und Android und iOS verwenden PNG-Bilder in festen Pixelgrößen.

Erhalte ich alle PNG-Größen für meine App in einem Durchgang?

Nein. Ein PNG enthält nur eine Größe, daher erzeugt jede Umwandlung genau eine Breite. Stellen Sie Größe des Ausgabebilds ändern auf eine Größe ein, wandeln Sie um, ändern Sie dann die Zahl und wandeln Sie erneut um. Jede Größe wird scharf aus dem Vektor gezeichnet.

Deckt die ICNS-Datei von dieser Seite Retina-Icons für den Mac ab?

Sie enthält Größen von 16 bis 256 px. Aktuelle macOS-App-Icons enthalten außerdem Einträge mit 512 px und 1024 px für Retina-Displays, die Xcode oder Apples iconutil aus PNGs erzeugen. Exportieren Sie diese beiden Größen hier als PNG und fügen Sie sie dem Set hinzu.

Sollte das Icon einen transparenten Hintergrund behalten?

Bei ICO, ICNS und Android-Launcher-Ebenen ja: Durch Transparenz kann das System seinen eigenen Hintergrund zeichnen. Eine Ausnahme ist das iOS-App-Store-Icon: Apple lehnt ein 1024-px-Marketing-Icon mit Alphakanal ab, geben Sie diesem PNG daher im SVG einen einfarbigen Hintergrund.

Warum wird mein detailreiches Logo als kleines Icon zum Klecks?

Bei 16 oder 32 px ist kein Platz für dünne Linien oder kleinen Text. Verstärken Sie Linien so, dass sie in der kleinsten Größe mindestens einen vollen Pixel abdecken, und lassen Sie die Wortmarke weg.