Toolonit
  1. Startseite
  2. Bild
  3. Bild zu Base64

Bild-zu-Base64-Konverter

Ein Bild in einen data:-URI-String umwandeln.

Bilder hierher ziehen oder zum Auswählen klicken

JPG, PNG, WebP, GIF, BMP, ICO, SVG oder AVIF. Dateien werden im Browser verarbeitet und nie hochgeladen. Die Bilder bleiben in diesem Browser, bis Sie sie entfernen.

Ctrl+OauswählenCtrl+Veinfügen

Verwandeln Sie ein Bild in Text, den Sie direkt in HTML, CSS, JSON oder Markdown einsetzen können. Legen Sie ein oder mehrere Bilder ab und erhalten Sie für jedes den Data-URI, das reine Base64, eine CSS-Hintergrundregel, ein HTML-<img>-Tag und ein Markdown-Bild – jeweils mit einem Klick in der Zwischenablage. Die Dateien werden von Ihrem Browser gelesen und verlassen nie Ihr Gerät; es ist kostenlos und ohne Anmeldung.

So wandeln Sie ein Bild in Base64 um

  1. Legen Sie Bilder irgendwo auf der Seite ab, fügen Sie eines mit Strg+V ein oder klicken Sie, um Dateien auszuwählen. Bilder, die Sie in einem anderen Bild-Tool hinzugefügt haben, sind schon hier, so wie sie jetzt sind: Eines, das Sie dort skaliert oder zugeschnitten und angewendet haben, ergibt die Data-URI des bearbeiteten Bildes. Mit dem Beispielbild können Sie es ohne eigene Datei ausprobieren.
  2. Klicken Sie unter einem Bild auf Data-URI, Base64, CSS, HTML oder Markdown, um diesen Code zu kopieren. Strg+C kopiert den Data-URI des ausgewählten Bildes.
  3. Fügen Sie den Code dort ein, wo Sie ihn brauchen, oder laden Sie ihn als Textdatei herunter. Bei mehreren Bildern speichert Alle herunterladen (ZIP) alle auf einmal.

Funktionen

  • Fünf Code-Schnipsel pro Bild: Data-URI, reines Base64, CSS-background-image, HTML-<img> und Markdown
  • Das HTML-Tag enthält Breite, Höhe und einen Alternativtext aus dem Dateinamen
  • Kopieren mit einem Klick; Strg+C kopiert den Data-URI des ausgewählten Bildes
  • Mehrere Bilder auf einmal, mit einer .txt-Datei pro Bild oder allen zusammen in einer ZIP-Datei
  • Eine Warnung bei Bildern über 100 KB, bei denen ein Link auf die Datei meist besser ist
  • PNG, JPG, GIF, WebP, SVG, AVIF, BMP und ICO, mit dem richtigen MIME-Typ, auch wenn der Browser keinen liefert

Ist das privat?

Ja. Ihr Browser liest die Datei und wandelt sie direkt auf der Seite um; nichts wird irgendwohin gesendet, und die Bilder bleiben in diesem Browser, bis Sie sie entfernen. Die Data-URI ist die Datei selbst und trägt daher die Metadaten eines Fotos mit: Gibt es einen GPS-Standort oder andere Metadaten, sagt Ihnen das Tool das und verweist auf den EXIF-Viewer, um sie vorher zu entfernen.

Häufige Fragen

Wann sollte ich einen Data-URI verwenden?

Bei kleinen Bildern wie Icons, Logos und winzigen Hintergründen, bei denen eine eingesparte Anfrage zählt, und überall dort, wo keine separate Datei möglich ist: in einer HTML-E-Mail, einer Seite aus nur einer Datei, einem JSON-Feld oder einem Markdown-Dokument. Große Fotos verlinken Sie besser als Datei, damit der Browser sie zwischenspeichern kann.

Um wie viel vergrößert Base64 eine Datei?

Um etwa ein Drittel. Base64 braucht 4 Zeichen für je 3 Bytes, ein 30-KB-Bild wird also zu etwa 40 KB Text. Ab etwa 100 KB ist ein Link auf die Datei meist besser, und das Tool warnt Sie.

Welchen Code-Schnipsel sollte ich kopieren?

Data-URI für ein src oder url(), das Sie selbst schreiben, CSS für eine fertige background-image-Regel, HTML für ein komplettes <img>-Tag mit Breite, Höhe und Alternativtext, Markdown für Dokumentation und Base64, wenn eine API oder ein JSON-Feld die reinen kodierten Daten erwartet.

Kann ich mehrere Bilder auf einmal umwandeln?

Ja. Fügen Sie so viele Bilder hinzu, wie Sie möchten; jedes erhält eigene Code-Schnipsel, und Alle herunterladen (ZIP) speichert eine Textdatei pro Bild.

Ähnliche Tools