Ueberblick
Dieses Tool wandelt codierte Bilddaten in eine normale Bilddatei um, die du prüfen, weiterverwenden oder speichern kannst. Es unterstützt sowohl reine Base64-Strings als auch vollständige Data-URLs und ist damit nützlich für Inhalte aus APIs, HTML-Attributen oder gespeicherten Datensätzen. Nach der Dekodierung erscheint eine Vorschau, sodass du MIME-Typ, Inhalt und visuelles Ergebnis direkt vergleichen kannst. Ist der String unvollständig, verändert oder gar kein Bild, wird keine brauchbare Vorschau erzeugt und du erkennst den Fehler sofort.
Anwendungsfaelle
- Avatare aus API-AntwortenDekodiere Benutzerbilder aus dem Backend, um exakt das Bild zu prüfen, das gespeichert oder angezeigt wird.
- HTML-E-Mails und CMS-InhalteStelle eingebettete Bilder aus Vorlagen, Mail-Markup oder Rich-Text-Inhalten vor der Weiterverwendung dar.
- Defekte Bildfelder prüfenErkenne, ob ein Feld eine gültige Data-URL, einen abgeschnittenen Base64-String oder gar kein Bild enthält.
- Generierte Assets exportierenWandle Base64 aus einer App, einem Skript oder einem Design-Export in eine Datei um, die du öffnen und teilen kannst.
So funktioniert es
- 1
Füge einen Base64-String oder eine vollständige Data-URL in das Eingabefeld ein.
- 2
Das Tool dekodiert die Daten und versucht, daraus ein Bild zu erstellen.
- 3
Prüfe die Vorschau, um Format und Inhalt zu bestätigen.
- 4
Lade das dekodierte Bild herunter, sobald das Ergebnis stimmt.
Beispiele
PNG-Avatar dekodieren
Eingabe: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAQAAAAAYLlVAAAAF0lEQVR42u3BAQ0AAADCIPunNscwYAAAAAAAAAB4G4xQAAaM9l7sAAAAASUVORK5CYII=
Ausgabe: PNG-Vorschau 64×64, bereit zum Download.
Sinnvoll, wenn Profilbilder als eingebettete Data-URL geliefert werden.
Base64-Logo aus JSON öffnen
Eingabe: iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABHklEQVR4nO2WsQ3CMBREz0o7qI4kYgM0wI4QK2gK6qgJ6mA5gQ0QK1gYt4dB8Nw0m3QkV3c9m5b5m0m8xWq2Qqf8r3xgQf5gM8j8x2YVQwQW2gQ9m9j0gk4m0m0j8kQ8G2jQ3C0g3Q0v5tqgYQ8A9m4QKQ0wYzQm3mS8n8v4wY8Q2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw2wQw
Ausgabe: Bildvorschau aus einem gekürzten Beispielstring erzeugt.
Hilfreich, um zu prüfen, ob ein aus JSON kopiertes Base64-Feld vollständig und gültig ist.
SVG-Bild in CSS prüfen
Eingabe: data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCIgdmlld0JveD0iMCAwIDEyOCAxMjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEyOCIgaGVpZ2h0PSIxMjgiIGZpbGw9IiMwMDc4ZGYiLz48L3N2Zz4=
Ausgabe: SVG-Vorschau mit einem einfarbig blauen Quadrat.
Praktisch, wenn ein Stylesheet oder eine Komponente Grafiken als codierte Data-URL speichert.
FAQ
Was ist besser: reines Base64 oder eine Data-URL?
Beides funktioniert. Eine Data-URL ist bequemer, wenn der MIME-Typ mitgeliefert wird. Reines Base64 reicht, wenn das Format bereits bekannt ist.
Warum lässt sich ein String manchmal dekodieren, aber das Bild wird nicht angezeigt?
Die Daten können unvollständig, beschädigt oder mit dem falschen MIME-Typ versehen sein. Auch gültiges Base64 kann scheitern, wenn die Bytes kein lesbares Bild ergeben.
Kann ich SVG, PNG und JPEG dekodieren?
Ja, sofern SVG korrekt als Data-URL oder Base64 kodiert ist. Der Inhalt muss jedoch ein gültiges SVG sein.
Was tun bei Zeilenumbrüchen oder Leerzeichen im Base64?
Zusätzliche Leerzeichen können die Dekodierung stören. Entferne unnötige Formatierung, wenn keine Vorschau erscheint.
Warum hat die heruntergeladene Datei nicht den ursprünglichen Namen?
Base64 enthält keinen Dateinamen. Das Tool dekodiert nur den Inhalt; der endgültige Name entsteht beim Download.
Kann man aus nicht-bildhaftem Base64 trotzdem ein Bild erzwingen?
Nein. Wenn die Bytes keine Bilddaten enthalten, entsteht keine brauchbare Grafikdatei.