Bild zu Base64 (und zurück)
Bette kleine Bilder direkt in HTML, CSS oder JSON ein, ohne zusätzliche Anfragen. Ziehe eine oder mehrere Dateien hierher und kopiere das Ergebnis im passenden Format; du kannst auch Base64 einfügen, um das Bild wiederherzustellen.
Zu 100 % in deinem Browser verarbeitet
Ctrl + Enter ausführenCtrl + C Ergebnis kopieren
So funktioniert es
- 1Ziehe ein oder mehrere Bilder hierher (JPG, PNG, WebP, GIF, SVG, AVIF).
- 2Wähle das Format: Data-URI, reines Base64, <img>-Tag, CSS oder Markdown.
- 3Kopiere den Code jedes Bildes mit einem Klick.
- 4Für die Gegenrichtung wechsle zu „Base64 → Bild“, füge den Text ein und lade das Bild herunter.
Anwendungsfälle
- Kleine Icons und Logos in CSS oder HTML einbetten, um Anfragen zu sparen.
- Bilder in HTML-E-Mails oder Vorlagen einfügen.
- Bilder in JSON über APIs senden.
- Das Bild aus einer im Webseiten-Code gefundenen Data-URI wiederherstellen.
Häufig gestellte Fragen
Wann lohnt sich Base64 für ein Bild?
Bei sehr kleinen Bildern (Icons mit wenigen KB), die du nicht separat laden willst. Bei großen Fotos lohnt es sich nicht: Base64 ist 33 % größer und wird vom Browser nicht separat gecacht.
Was ist eine Data-URI?
Eine URL, die die kodierte Datei selbst enthält, in der Form data:image/png;base64,… Sie lässt sich im src-Attribut eines Bildes oder in CSS-url() verwenden.
Werden meine Bilder hochgeladen?
Nein. Die Umwandlung läuft im Browser; die Bilder verlassen dein Gerät nie.
Kann ich Base64 ohne Präfix einfügen?
Ja. Wir erkennen den Bildtyp anhand der Signatur (JPG, PNG, GIF, WebP, SVG), auch ohne data:-Präfix.