DE

Bild in Base64 umwandeln

Mit diesem Werkzeug können Sie ein Bild in Base64 umwandeln und direkt als Data-URL, HTML-Tag, CSS-Hintergrund, Markdown oder JSON kopieren. Auf Wunsch wird es vorher verkleinert oder in PNG, JPG oder WebP umgewandelt. Umgekehrt zeigt der Decoder aus eingefügtem Base64-Text das Bild und speichert es als Datei.

Quelle: RFC 2397, RFC 2397 – The "data" URL scheme. Stand: .

Dateien hierher ziehen oder

Ein Bild (JPG, PNG, GIF, WebP, SVG, ICO …), bis 10 MB

Tipp: Bilder lassen sich auch mit Strg + V einfügen.

Ihre Dateien werden nur in Ihrem Browser verarbeitet und nicht hochgeladen – sie verlassen Ihr Gerät nicht.

Base64-Code

Wählen Sie ein Bild – hier erscheint dann der Base64-Code.

Meine Toolbox

Ergebnis

So wird gerechnet

So wandeln Sie ein Bild in Base64 um

  1. Bild hineinziehen, auswählen oder mit Strg + V einfügen. Der Base64-Code erscheint sofort.
  2. Ausgabe wählen: Data-URL für src oder url(), nur Base64 für APIs, ein fertiges HTML-img-Tag mit Breite und Höhe, eine CSS-Zeile für background-image, Markdown oder JSON.
  3. Kopieren oder als Textdatei speichern.

Eine Data-URL folgt RFC 2397: data:image/png;base64, und dahinter die Bilddaten in Base64 nach RFC 4648. Der MIME-Typ wird am Dateiinhalt erkannt, nicht an der Endung – ein als .jpg benanntes PNG bekommt also richtig image/png.

Wie groß wird ein Bild in Base64?

Base64 macht aus je 3 Bytes 4 Zeichen, der Text ist also rund 33 % größer als die Datei: Ein Bild mit 30 KB wird zu etwa 40.000 Zeichen. Deshalb lohnt sich Base64 vor allem für kleine Grafiken wie Icons, Logos oder Platzhalter in E-Mails, HTML-Dateien ohne externe Ressourcen und CSS. Große Fotos verkleinern Sie am besten vorher mit dem Feld „Verkleinern auf Breite“ oder wandeln sie in WebP bzw. JPG um.

Base64 zurück in ein Bild

Im Modus „Base64 → Bild“ fügen Sie eine Data-URL, eine ganze CSS-Zeile, ein HTML-img-Tag oder nur den Base64-Text ein – auch mit Zeilenumbrüchen, ohne Gleichheitszeichen am Ende oder in der URL-sicheren Variante mit - und _. Das Werkzeug erkennt JPG, PNG, GIF, WebP, BMP, TIFF, AVIF, HEIC, SVG und ICO, zeigt Größe und Abmessungen und speichert die Datei mit der passenden Endung. Weicht der Typ in der Data-URL vom echten Inhalt ab, gibt es einen Hinweis.

Datenschutz und Grenzen

Bilder und eingefügter Text bleiben im Browser und werden weder hochgeladen noch gespeichert. Zum Kodieren sind Bilder bis 10 MB möglich; SVG und ICO werden unverändert übernommen. Beliebigen Text oder Dateien kodieren Sie mit Base64 kodieren und dekodieren, Bilder umwandeln können Sie mit Bild umwandeln, und kleiner machen Sie sie mit Bild komprimieren.

Häufige Fragen

Wie wandle ich ein Bild in Base64 um?

Bild hier auswählen – der Code erscheint sofort. Als Data-URL beginnt er mit data:image/…;base64, und lässt sich direkt in HTML oder CSS verwenden.

Wie binde ich ein Base64-Bild in HTML ein?

Ausgabe „HTML “ wählen und kopieren: <img src="data:image/png;base64,…" alt="…">. Das Werkzeug trägt Breite und Höhe gleich mit ein.

Wie wandle ich Base64 wieder in ein Bild um?

Oben „Base64 → Bild“ wählen, den Text einfügen und „Bild anzeigen“ klicken. Das Bild erscheint und lässt sich mit der richtigen Dateiendung speichern.

Warum ist der Base64-Code größer als das Bild?

Base64 stellt je 3 Bytes mit 4 Textzeichen dar. Der Code ist dadurch etwa ein Drittel größer als die Bilddatei.

Kann ich SVG in Base64 umwandeln?

Ja. SVG wird unverändert kodiert und bekommt den Typ image/svg+xml, zum Beispiel für CSS-Hintergründe.

Wird mein Bild hochgeladen?

Nein. Kodieren und Dekodieren laufen vollständig in Ihrem Browser; nichts wird gespeichert.

Quellen und Rechtsgrundlagen

Stand: · So prüfen wir

Passende Werkzeuge