Über Bild in Base64 umwandeln
Symbole lassen sich als Data-URL direkt in CSS oder JSON einbetten. Dieses Werkzeug rechnet in beide Richtungen: vom Bild zum String und vom String zurück zum Bild.
Funktionsumfang
Nach der Auswahl entsteht der vollständige String, beginnend mit data:image, Ein eingefügter Base64-String wird wieder als Bildvorschau dargestellt, Gängige Bildformate werden verarbeitet; Sonderzeichen in Pfaden und Dateinamen stören nicht, Umgerechnet wird ausschließlich lokal, das Bild läuft nicht über das Netz.
So gehen Sie vor
- Zum Kodieren das Bild auswählen – der vollständige Base64-String erscheint im Feld und lässt sich kopieren
- Zum Dekodieren den mit data:image beginnenden String einfügen und die Vorschau ansehen
- Im Stylesheet passt die Schreibweise url("data:image/png;base64,...")
- Die Länge beachten: Base64 vergrößert den Umfang um rund ein Drittel und eignet sich daher nur für kleine Bilder
Anwendungsfälle
- Ein wenige Kilobyte großes Symbol direkt im Stylesheet einbetten und eine Anfrage sparen
- Ein System versorgen, das Bilder als Base64-String entgegennimmt
- Ein Stück Base64 prüfen: Was für ein Bild steckt eigentlich darin?
Nachgefragt
Ist Base64 verschlüsselt?Nein. Es ist nur eine Umschreibung; jeder kann die Daten wieder in ein Bild zurückverwandeln.
Warum ist der String so lang?Base64 stellt 3 Byte mit 4 Zeichen dar; der Umfang wächst dadurch um etwa 33 Prozent – das liegt an der Kodierung selbst. Für große Bilder ist das ungeeignet.
Mein String beginnt nicht mit data:image – was nun?Dann fehlt die Typangabe. Ergänzen Sie zum Beispiel data:image/png;base64, davor, dann erscheint die Vorschau.
Welche Richtungen werden unterstützt?Bild zu Base64 und Base64 zurück zum Bild.
Grenzen und Voraussetzungen
Verarbeitet werden ausschließlich vollständige Data-URLs, die mit data:image beginnen. Ein reiner Base64-String ohne data:-Präfix muss erst um die Typangabe ergänzt werden, bevor er als Bild erscheint. Base64 ist keine Verschlüsselung – jeder kann die Daten zurückrechnen, für vertrauliche Bilder ist es deshalb nicht geeignet. Große Bilder ergeben sehr lange Strings, die sich nicht sinnvoll in Quellcode einbetten lassen.
Passt gut dazu
Diese Werkzeuge werden häufig zusammen mit Bild in Base64 umwandeln verwendet: