ICO in PNG umwandeln und PNG in ICO
ICO in PNG umwandeln: alle Größen einer ICO-Datei als PNG speichern, oder aus einem Bild eine favicon.ico mit mehreren Größen erstellen.
ICO in PNG
PNG in ICO
Alles läuft in Ihrem Browser. Eingaben verlassen Ihr Gerät nicht.
Was in einer ICO-Datei steckt
Mit diesem Werkzeug können Sie ICO in PNG umwandeln und umgekehrt PNG in ICO. Eine ICO-Datei ist ein Container: Sie enthält ein Verzeichnis und mehrere Bilder in verschiedenen Größen und Farbtiefen. Beim ICO öffnen liest das Skript dieses Verzeichnis selbst aus, dekodiert jedes Bild, egal ob es als PNG oder als klassische Windows-Bitmap mit Transparenzmaske gespeichert ist, und bietet jede Größe als PNG zum Speichern an. Auch Cursor-Dateien (.cur) funktionieren, ihr Hotspot wird mit angezeigt.
Um eine ICO-Datei erstellen zu lassen, wählen Sie ein Bild und die gewünschten Größen. Bis 128 Pixel schreibt das Werkzeug 32-Bit-Bitmaps mit Alphakanal, die auch ältere Windows-Versionen lesen; die Größe 256 wird als PNG eingebettet, wie es seit Windows Vista üblich ist. So entsteht eine favicon.ico mit 16, 32 und 48 Pixel, die Browser, Lesezeichen und Windows-Verknüpfungen nutzen. Für ein ganzes Favicon-Paket mit PNG-Größen und HTML-Code gibt es den Favicon-Generator.
Grenzen: Sehr alte ICO-Dateien mit komprimierten Bitmaps (RLE) werden nicht unterstützt und als Fehler gemeldet. Kleine Größen wie 16 Pixel sollten Sie möglichst aus einer einfachen Vorlage erzeugen; feine Details verschwimmen beim Verkleinern. Zum ICO konvertieren werden Bilder nur lokal per Canvas verarbeitet.
Anleitung: ICO in PNG umwandeln in 4 Schritten
- Für ICO in PNG: Wählen Sie unter „ICO-Datei öffnen“ eine .ico- oder .cur-Datei; alle enthaltenen Größen erscheinen als Liste.
- Speichern Sie die gewünschte Größe mit „PNG speichern“.
- Für PNG in ICO: Wählen Sie unter „Bild für ICO“ ein PNG, JPG oder SVG und haken Sie die gewünschten Größen an.
- Mit „ICO erstellen“ laden Sie die fertige Datei herunter, standardmäßig als
favicon.ico.
Typische Anwendungsfälle
- Ein altes Programm- oder Website-Symbol aus einer .ico-Datei als PNG für Präsentationen herauslösen.
- Eine favicon.ico mit 16, 32 und 48 Pixel für ältere Browser und Windows-Verknüpfungen erstellen.
- Prüfen, welche Größen und Farbtiefen eine vorhandene ICO-Datei tatsächlich enthält.
- Symbole für Windows-Anwendungen oder Desktop-Verknüpfungen mit 256 Pixel erzeugen.
Häufige Fragen
Wie öffne ich eine ICO-Datei?
Wählen Sie die Datei oben unter „ICO-Datei öffnen“. Alle enthaltenen Größen werden mit Farbtiefe und Format angezeigt und lassen sich einzeln als PNG speichern.
Welche Größen soll ich für ein Favicon wählen?
16, 32 und 48 Pixel decken Browser-Tabs, Lesezeichen und Windows ab. Für Programmsymbole kommen 256 Pixel dazu.
Bleibt die Transparenz erhalten?
Ja. In beide Richtungen wird der Alphakanal übernommen; beim Lesen klassischer Bitmaps wird zusätzlich die Transparenzmaske ausgewertet.
Kann ich auch .cur-Cursor umwandeln?
Ja. Cursor-Dateien haben denselben Aufbau wie ICO. Statt Farbebenen und Bittiefe stehen im Verzeichnis die Koordinaten des Hotspots, die das Werkzeug anzeigt.
Brauche ich heute noch eine favicon.ico?
Moderne Browser kommen mit PNG oder SVG aus. Eine favicon.ico im Hauptverzeichnis schadet aber nicht und wird von manchen Programmen, Feedreadern und älteren Browsern weiterhin abgefragt.
Welche Größen gehören in eine favicon.ico?
Üblich sind 16, 32 und 48 Pixel. Für Windows-Symbole kommen 24, 64, 128 und 256 Pixel dazu. Jede Größe macht die Datei größer, daher nur aufnehmen, was gebraucht wird.
Das könnte auch helfen
Farbumwandler
HEX, RGB, HSL, HSV, CMYK und OKLCH ineinander umrechnen, mit Farbwähler, Vorschau und Farbtönen.
ÖffnenFarbpalette aus Bild
Die wichtigsten 5 bis 10 Farben eines Bildes als HEX-Codes ermitteln, lokal im Browser.
ÖffnenKontrast prüfen (WCAG)
Kontrastverhältnis zweier Farben nach WCAG prüfen, AA und AAA, mit Vorschlag für passende Farbtöne.
ÖffnenCSS-Gradient-Generator
Linearen, radialen und konischen Farbverlauf zusammenstellen und den CSS-Code kopieren.
ÖffnenBox-Shadow-Generator
CSS-Schatten mit mehreren Ebenen, inset und Deckkraft einstellen, Vorschau sehen, Code kopieren.
ÖffnenFlexbox-Generator
Flexbox-Eigenschaften per Auswahl setzen, die Wirkung live sehen und das CSS kopieren.
Öffnen