Tools · Bild · Bild in Base64 umwandeln
Bild in Base64 umwandeln
Wandeln Sie ein Bild in eine Base64-Daten-URI um, mit fertigen HTML- und CSS-Codeschnipseln zum Kopieren.
Füge eine Datei hinzu und starte das Tool.
Deine Datei ist bereit.
Versuch eine andere Datei, oder versuch es erneut.
Einstellungen
Wähle eine Datei, passe die Einstellungen an und starte das Tool.
Läuft komplett im Browser. Es wird nichts hochgeladen.
So funktioniert es
Ein oder mehrere Bilder ablegen.
Die Daten-URI, das <img>-Tag oder den CSS-Codeschnipsel kopieren, den Sie brauchen.
Dort einfügen, wo Sie es brauchen - in Ihr HTML, CSS oder eine E-Mail-Vorlage.
Häufige Fragen
Es ist ein als Text kodiertes Bild, das direkt in einer Zeichenkette data:image/...;base64,... eingebettet ist, sodass es inline in HTML, CSS oder JSON stehen kann, statt eine separate Datei zu sein, die der Browser abrufen muss.
Nein, das ist gar nicht möglich - die Kodierung nach Base64 ist eine einzelne Browserfunktion (FileReader), die die Datei auf Ihrem Gerät liest. Es gibt keinen Serverumweg zu vermeiden, denn es gab nie einen.
Base64 kodiert je 3 Bytes als 4 Textzeichen, sodass die kodierte Zeichenkette etwa ein Drittel größer ist als die Originaldatei. Das Tool zeigt beide Größen an, damit Sie wissen, was Sie erwartet.
Mit diesem Tool noch nicht - wir haben noch keinen Base64-zu-Bild-Konverter gebaut. Dieses Tool geht nur in die Richtung Bild zu Text.
Anleitungen
Ein genauerer Blick auf einzelne Probleme, die dieses Tool löst.
Why Inlining a Small Image Beats Linking to a File
A tiny icon shouldn't need its own HTTP request. Here's what a data URI actually does, and when embedding an image as text beats linking to it as a file.
Anleitung lesenHow to Embed an Image Directly in Your HTML, No File Needed
Drop an image, get a ready-to-paste snippet - no separate icon file to manage, no upload. Here's exactly how the encoding works and what each output actually gives you.
Anleitung lesenData URI vs. Image File: When the Bigger String Is Still Worth It
A Base64 string is always bigger than the file it came from. Here's the actual math behind that, and how to decide whether the trade-off is worth it for a specific image.
Anleitung lesen
Kommentare