Bild hier ablegen
oder zum Auswählen klicken · PNG, JPG, WebP, GIF
Bild auswählenÜber das Bild zu Base64
Lege ein beliebiges Bild ab und erhalte sofort seine Base64-Kodierung, in drei einfügefertigen Varianten: eine vollständige Data-URI für img-Tags, den rohen Base64-String für APIs und Payloads, und eine CSS-background-image-Regel, die du direkt in ein Stylesheet übernehmen kannst. Eine Live-Vorschau mit Größenanzeige zeigt dir vor dem Kopieren genau, was du einbettest — überdimensionierte Assets schleichen sich so nie unbemerkt in deinen Code.
Die Base64-Kodierung eines Bildes erlaubt es, es direkt in HTML, CSS, JSON oder eine E-Mail-Vorlage einzubetten — keine separate Datei, kein zusätzlicher HTTP-Request. Die Umwandlung passiert vollständig auf deinem Gerät mit dem FileReader des Browsers, das Bild wird also nirgendwohin hochgeladen. Das zählt, wenn du Logos, Mockups oder Material unter NDA kodierst: Was du auf der Seite ablegst, bleibt auf deinem Rechner.
Funktionen
- Vollständige Data-URI, rohes Base64 oder CSS-Schnipsel kopieren
- Live-Vorschau des genauen Bildes, das kodiert wird
- Zeigt die kodierte Größe vor dem Kopieren an
- Funktioniert mit PNG, JPG, WebP, GIF und SVG
- Lokal mit FileReader kodiert — nichts wird hochgeladen
- Kostenlos, sofort und ohne Konto
So wandelst du ein Bild online in Base64 um
- Ziehe dein Bild auf das Tool oder klicke, um eine Datei zu wählen.
- Prüfe die Vorschau und die darunter angezeigte kodierte Größe.
- Klicke auf Data-URI kopieren für img-Tags oder JSON.
- Oder kopiere den rohen Base64-String bzw. den CSS-background-image-Schnipsel.
- Füge das Ergebnis in deinen Code, dein Stylesheet oder deinen API-Request ein.
Häufig gestellte Fragen
Was ist eine Base64-Data-URI?
Eine Data-URI packt den Inhalt einer Datei in einen Textstring, mit vorangestelltem MIME-Typ — zum Beispiel data:image/png;base64,iVBOR… . Browser rendern sie genau wie eine normale Bild-URL, du kannst Bilder also direkt in HTML, CSS oder Markdown einbetten, ohne eine separate Datei zu hosten.
Verringert Base64-Kodierung die Bildqualität?
Nein. Base64 ist eine verlustfreie Textdarstellung der exakten Bytes deiner Datei — beim Dekodieren erhältst du eine pixelgenaue Kopie des Originals. Der Kompromiss betrifft die Größe, nicht die Qualität: Weil Binärdaten in Textzeichen ausgeschrieben werden, ist der kodierte String rund 33 % größer als die Originaldatei.
Wann sollte ich ein Bild als Base64 einbetten?
Es glänzt bei kleinen Assets: Icons, Logos, winzige Hintergründe, E-Mail-Signaturen und Ein-Datei-HTML-Dokumente, bei denen der gesparte HTTP-Request den Größenaufschlag überwiegt. Für große Fotos ist eine normale Bilddatei meist die bessere Wahl, weil Base64 das Markup aufbläht und nicht separat gecacht werden kann.
Gibt es eine Dateigrößen-Grenze?
Es gibt keine feste Obergrenze — die Kodierung läuft im Speicher deines Browsers, typische Icons, Logos und Fotos werden also sofort umgewandelt. Auch Dateien mit mehreren Megabyte funktionieren, aber der entstehende String wird unhandlich beim Einfügen in Code und langsam für Editoren — eine praktische, keine technische Grenze.
Wird mein Bild auf einen Server hochgeladen?
Nein. Die Datei wird vollständig auf deinem Gerät mit der FileReader-API des Browsers gelesen und kodiert — es gibt keinen Netzwerk-Request mit deinen Bilddaten. Du kannst die Seite sogar laden, die Internetverbindung trennen, und die Umwandlung funktioniert weiterhin.