> base64 | decode | PNG <
// Base64-Strings und Daten-URIs zurück in PNG-Bilder dekodieren — Alpha bleibt erhalten, sofortige Vorschau, Ein-Klick-Download
Dekodiertes PNG erscheint hier
Bit-genau
Das dekodierte PNG ist byte-identisch mit dem Original — Alpha, Palette und Farbprofil überstehen den Round-Trip unversehrt.
Lokale Dekodierung
Die Base64-Nutzdaten werden in Ihrem Browser mit atob() dekodiert. Kein Server-Upload, kein Logging Ihrer PNG-Bytes.
Live-Vorschau
Sehen Sie das dekodierte Bild, seine Abmessungen und die ungefähre Dateigröße sofort vor dem Herunterladen.
// ÜBER BASE64 ZU PNG
Was dieses Tool akzeptiert
- >Daten-URI: data:image/png;base64,iVBORw0KGgo…
- >Rohe PNG-Base64-Nutzdaten (beginnt mit iVBORw0KGgo)
- >Base64 mit eingebetteten Leerzeichen / Zeilenumbrüchen
- >Standard-RFC-4648-Alphabet (+/, optionales =-Padding)
- >URL-sicheres Base64 (-_) — wird beim Dekodieren automatisch normalisiert
- >Unicode-bewusstes Einfügen — BOMs werden entfernt
Häufige Anwendungsfälle
- >Einen Screenshot aus der Daten-URI des DOM-Inspektors speichern
- >Ein Logo aus einem Daten-URI-CSS-Hintergrund extrahieren
- >Ein Bild aus einer JSON-API-Antwort wiederherstellen
- >Ein Bild aus einer TEXT-Datenbankspalte wiederherstellen
- >Ein PNG aus einem E-Mail-MIME-Teil wiederherstellen
- >Ein in ein Inline-SVG eingebettetes Icon inspizieren
- >Ein fehlerhaftes <img src="data:image/png;base64,…">-Tag debuggen
So funktioniert die Base64-→-PNG-Dekodierung
Der Decoder entfernt etwaige Daten-URI-Präfixe, normalisiert Leerzeichen und URL-sichere Zeichen und ruft dann atob() auf, um jede 4-Zeichen-Gruppe zurück in 3 Binärbytes zu konvertieren. Das Byte-Array wird in einen Blob mit dem MIME-Typ image/png gepackt, erhält eine Object-URL und wird in einem <img>-Element gerendert. Da Base64 bijektiv zum Binärformat ist, ist die Ausgabe bit-identisch zum ursprünglichen PNG — ein SHA-256 der dekodierten Datei stimmt mit dem Original überein.
Beispiel PNG Daten-URI:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==
Performance & Kompatibilität
- >Die Dekodierung ist O(n) bezüglich der Nutzlastlänge — bewältigt 100 MB+ problemlos
- >Verwendet das native atob() des Browsers — kein schwerer JS-Shim
- >Unterstützt mehrframiges APNG, wenn der Viewer es unterstützt
- >Funktioniert in allen modernen Browsern (Chrome, Firefox, Safari, Edge)
- >Mobile-responsive Vorschau mit Pinch-to-Zoom
- >Download verwendet eine Blob-URL — kein zwischengeschalteter Server-Roundtrip
// SO DEKODIEREN SIE BASE64 ZU PNG
Schritt 1: Einfügen
Fügen Sie den Base64-String oder die vollständige Daten-URI in das Eingabefeld ein
Schritt 2: Dekodieren
Klicken Sie auf [DECODE] — das PNG wird sofort in der Vorschau gerendert
Schritt 3: Prüfen
Prüfen Sie Abmessungen, Dateigröße und Alphakanal vor dem Speichern
Schritt 4: Herunterladen
Klicken Sie auf [DOWNLOAD .png], um ein bit-identisches PNG auf der Festplatte zu speichern
// CODE-BEISPIELE — BASE64 ZU PNG
JavaScript (Browser)
// Decode Base64 → PNG Blob → download link
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
const bin = atob(b64);
const arr = new Uint8Array(bin.length);
for (let i = 0; i < bin.length; i++) arr[i] = bin.charCodeAt(i);
const blob = new Blob([arr], { type: 'image/png' });
const url = URL.createObjectURL(blob);
window.open(url);Rohe Base64-Nutzdaten in einen Blob dekodieren und öffnen. Für eine vollständige Daten-URI akzeptiert das <img>-Tag sie direkt.
Node.js
const fs = require('fs');
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
fs.writeFileSync('out.png', Buffer.from(b64, 'base64'));Einzeiler mit Nodes eingebautem Buffer, um Base64 zu dekodieren und eine PNG-Datei zu schreiben.
Python
import base64
with open('out.png', 'wb') as f:
f.write(base64.b64decode('iVBORw0KGgoAAAANSUhEUg...'))Nur Standardbibliothek — Base64-Text zurück zu PNG-Bytes dekodieren.
PHP
<?php
file_put_contents('out.png', base64_decode('iVBORw0KGgoAAAANSUhEUg...'));Einzeiler mit dem eingebauten base64_decode() und file_put_contents().
Shell (macOS / Linux)
echo 'iVBORw0KGgoAAAANSUhEUg...' | base64 -d > out.pngPOSIX base64 -d / -D liest Text von stdin und schreibt das dekodierte PNG nach stdout.
// FAQ — BASE64 ZU PNG
F: Was ist Base64-zu-PNG-Dekodierung?
A: Sie kehrt ein Base64-kodiertes PNG zurück in seine ursprüngliche Binärform um. Der eingefügte String enthält 4 ASCII-Zeichen pro 3 Binärbytes; der Decoder liest jeweils 4 Zeichen, wendet die Alphabet-Suche nach RFC 4648 an und schreibt 3 Bytes pro Gruppe, bis der String erschöpft ist. Das resultierende Byte-Array ist eine vollständige, gültige PNG-Datei, die Sie in der Vorschau ansehen, speichern oder überall dorthin senden können, wo ein normales PNG akzeptiert wird.
F: Woher weiß ich, dass der Base64-String wirklich ein PNG ist?
A: Die ersten 8 Bytes jedes PNG sind die magische Signatur 89 50 4E 47 0D 0A 1A 0A. Base64-kodiert beginnen diese 8 Bytes immer mit iVBORw0KGgo. Daher ist jeder Base64-String, der mit iVBORw0KGgo beginnt, ein PNG. Andere Formate haben unterschiedliche Präfixe: /9j/ ist JPEG, R0lGOD ist GIF, UklGR ist WebP. Unser Decoder erkennt PNGs automatisch an diesem magischen Präfix und greift auf den MIME-Typ in der Daten-URI zurück, falls vorhanden.
F: Kann ich eine Daten-URI einfügen oder nur rohes Base64?
A: Beides. Wenn Ihr String mit data:image/png;base64, beginnt, entfernt der Decoder das Präfix automatisch. Fügen Sie nur den Nutzdatenteil ein, leiten wir den PNG-MIME-Typ aus den magischen Bytes ab. Leerzeichen, Zeilenumbrüche, Wagenrückläufe und Tabulatoren werden vor der Dekodierung normalisiert, sodass Sie eine hübsch formatierte JSON-Antwort einfügen können, ohne etwas zu beschädigen.
F: Das dekodierte PNG ist kaputt — warum?
A: Häufige Ursachen:
• Abgeschnittener String — das Base64 wurde irgendwo abgeschnitten (z. B. durch ein Zeilenlimit in Ihrer Kopierquelle). Ein vollständiges PNG-Base64 endet mit RU5ErkJggg== (dem IEND-Chunk); fehlt das, ist die Datei unvollständig.
• URL-sicheres Alphabet — verwendet der String -_ statt +/ (base64url), normalisiert unser Tool das; andere Decoder lehnen es möglicherweise ab.
• Doppelt kodiert — das PNG wurde zweimal Base64-kodiert. Dekodieren Sie es erneut.
• Kein PNG — die Nutzdaten sind tatsächlich JPEG oder WebP. Verwenden Sie unseren generischen Base64-→-Bild-Decoder, der jedes Format automatisch erkennt.
F: Gehen beim Zurückdekodieren zu PNG Qualität oder Transparenz verloren?
A: Nein. Base64 ist eine bitgenaue, reversible Transformation. Das dekodierte PNG ist byte-identisch zum Original: Alphakanal, Palette (PLTE), Transparenz (tRNS), Farbprofil (iCCP/sRGB), Gamma (gAMA) und physische Pixelmaße (pHYs) bleiben alle erhalten. Ein SHA-256-Hash der dekodierten Datei stimmt mit dem Hash des Originals überein. Sehen Sie einen Unterschied, ist er vor der Kodierung entstanden, nicht während des Base64-Round-Trips.
F: Kann ich Base64 im Terminal zu PNG dekodieren?
A: Ja. Auf macOS und Linux: echo 'iVBORw0KGgo…' | base64 -d > out.png
(Ältere macOS-Versionen nutzen -D.)
Auf Windows PowerShell: [IO.File]::WriteAllBytes('out.png', [Convert]::FromBase64String('iVBORw0KGgo…'))
Ist der String eine vollständige Daten-URI, entfernen Sie zuerst das Präfix data:image/png;base64, (die meisten Shells akzeptieren sed 's|^data:.*base64,||').
F: Wie groß darf die Base64-PNG-Eingabe sein?
A: Wir dekodieren im Browser, daher ist das Limit der Speicher Ihres Geräts — komfortabel 100 MB+ auf dem Desktop. Ein 100 MB dekodiertes PNG benötigt ~135 MB Base64-Text, was die meisten Browser ohne Murren einfügen. Wenn Sie mit sehr großen wissenschaftlichen oder medizinischen PNGs arbeiten, ziehen Sie eine serverseitige Dekodierung in Betracht, da die Performance von atob() im Browser nahe der Speichergrenze nachlässt.
F: Funktioniert dieser Decoder offline?
A: Ja. Die gesamte Dekodierung verwendet die nativen APIs atob() + Uint8Array + Blob, die in jeden modernen Browser eingebaut sind. Nachdem die Seite einmal geladen ist, können Sie die Netzwerkverbindung trennen und weiter dekodieren. Keine externen Dienste, kein Server-Roundtrip, keine Analytics auf Ihren Bild-Nutzdaten.
F: Was ist der Unterschied zwischen einem Base64-PNG und einer normalen PNG-Datei?
A: Sie enthalten exakt dieselben Bytes. Eine normale .png-Datei ist das rohe Binärformat; ein Base64-PNG-String ist dasselbe Binärformat, umgeschrieben im 64-Zeichen-ASCII-Alphabet. Die Base64-Form ist 33 % größer, aber sicher zur Einbettung in HTML-Attribute, JSON-Strings, CSS-url()s und E-Mails. Sie können keine rohen PNG-Bytes in HTML einfügen — sie enthalten Nullbytes und High-Bit-Zeichen, die Textparser beschädigen. Base64 ist der Workaround.
F: Lädt ein Base64-PNG schneller als eine separate .png-Datei?
A: Nur für winzige Bilder. Base64 spart einen HTTP-Roundtrip, der bei einer neuen Verbindung 50–100 ms betragen kann — nützlich für kritische UI-Icons unter 4 KB. Für alles Größere gewinnt eine separate .png-Datei mit lang gültigen Cache-Headern fast immer, weil (a) gzip Base64-Text schlecht komprimiert, (b) Daten-URIs nicht unabhängig gecacht werden können und (c) sie das HTML-Parsing blockieren. Verwenden Sie Base64 für Above-the-Fold-Mikro-Assets, nicht für Hero-Bilder.
F: Kann ich Base64 zu PNG dekodieren, ohne die Daten irgendwohin hochzuladen?
A: Ja — dieses Tool läuft zu 100 % clientseitig. Ihr Base64-String wird in JavaScript auf Ihrem Gerät dekodiert, lokal in einen Blob verpackt und über URL.createObjectURL() angezeigt. Nichts wird hochgeladen. Sie können dies verifizieren, indem Sie den Netzwerk-Tab der Browser-DevTools beim Dekodieren öffnen — es werden keine Anfragen nach außen gesendet. Den gesamten Ablauf offline (Flugmodus) auszuführen funktioniert nach dem initialen Seitenladen ebenfalls.
F: Wie dekodiere ich Base64 zu PNG in Produktionscode?
A: In Node.js: fs.writeFileSync('out.png', Buffer.from(b64, 'base64')). In Python: open('out.png','wb').write(base64.b64decode(b64)). In Go: b, _ := base64.StdEncoding.DecodeString(b64); os.WriteFile("out.png", b, 0644). In Java: Files.write(Path.of("out.png"), Base64.getDecoder().decode(b64)). In Rust: std::fs::write("out.png", base64::decode(b64)?)?. In PHP: file_put_contents('out.png', base64_decode($b64)). Die Standardbibliothek jeder Laufzeit enthält einen Base64-Decoder — eine Drittanbieter-Abhängigkeit ist selten nötig.
F: Base64 zu PNG vs. Base64 zu JPG — welchen Decoder soll ich nutzen?
A: Verwenden Sie Base64 → PNG, wenn der Base64-String mit iVBORw0KGgo beginnt (oder die Daten-URI data:image/png;base64, sagt). Verwenden Sie Base64 → JPG, wenn der String mit /9j/4AAQ oder /9j/2wC beginnt. Bei Unsicherheit nutzen Sie unseren generischen Base64-→-Bild-Decoder, der die magischen Bytes untersucht und automatisch das richtige Format wählt. Erzwingen Sie niemals ein Format, das nicht zu den Nutzdaten passt — die dekodierte Datei enthält gültige Bytes, ist aber unlesbar.