ConvertBlink
DE

JPEG zu Base64 Data-URI Encoder, kostenlos im Browser

Wandle ein JPEG in eine Base64 Data-URI um, die du direkt in HTML, CSS oder JS einfügst. Läuft komplett im Browser, kein Upload. String mit einem Klick kopieren.

Browser-nativ
Privatsphäre zuerst
Kostenlos

Jetzt konvertieren

Datei hierher ziehen

oder

Wie es funktioniert

Mit einer Base64 Data-URI steckt ein JPEG direkt in der Seite, statt als separate Datei zu existieren, die der Browser erst nachladen muss. Lege ein .jpg oder .jpeg ab, das Tool dekodiert es lokal und gibt dir einen einzigen `data:`-String, den du in ein `<img src>`, ein CSS-`background-image` oder eine JavaScript-Variable einsetzt. Kein Asset-Ordner, kein Build-Schritt, kein zusätzlicher HTTP-Aufruf für dieses eine Bild. Eine Sache solltest du zur Ausgabe wissen: Der Encoder dekodiert dein JPEG und gibt es als PNG-basierte Data-URI wieder aus (`data:image/png;base64,...`). Diese Umverpackung rührt die Pixel nicht an, aber PNG speichert sie ohne die fotografische Kompression von JPEG, daher ist der String meist größer als das ursprüngliche .jpg, zusätzlich zu den rund einem Drittel Overhead, den Base64-Text bei jeder Binärdatei mitbringt. Heißt im Klartext: Nimm das für kleine Assets wie Icons, Sprites und Thumbnails, nicht für ein 4000px-Foto. Das Ergebnis erscheint in einem Textfeld mit Kopieren-Button, du holst dir also den ganzen String mit einem Klick. Alles läuft in deinem Browser. Dein Bild wird nie hochgeladen, gespeichert oder von einem Server gesehen, was du überprüfen kannst, indem du die Kodierung mit ausgeschaltetem Netzwerk durchführst.

Verwandte Konvertierungs-Tools

Entdecken Sie weitere leistungsstarke Konverter, die für Ihren Workflow nützlich sein könnten

JPEG-Optimierer: JPG-Dateigröße mit mozjpeg verkleinern

JPEGs mit mozjpeg neu kodieren und so die Dateigröße bei nahezu gleicher Qualität reduzieren. Läuft komplett im Browser, ohne Upload, und gibt nie eine größere Datei zurück.

.jpg.jpeg
Jetzt testen

JPG in PDF: Fotos zu einem mehrseitigen PDF zusammenfügen

Mehrere JPG-Fotos im Browser zu einem mehrseitigen PDF zusammenfügen. Seiten per Drag-and-drop sortieren, hinzufügen oder entfernen. JPGs bleiben unverändert, keine Neukomprimierung, kein Upload.

.jpg.jpeg
Jetzt testen

Bild in Base64 Data-URI umwandeln (JPG/PNG/GIF/WebP)

Wandle ein JPG, PNG, GIF oder WebP in eine Base64-data:-URI um, die du direkt in HTML, CSS oder JS einfügst. Läuft im Browser, deine Dateien bleiben auf dem Gerät.

.jpg.jpeg +3
Jetzt testen

PNG in Base64 umwandeln: PNG als Data-URI kodieren

PNG direkt im Browser in eine Base64-Data-URI kodieren. Fügen Sie sie in HTML, CSS oder JS ein, um kleine Icons inline einzubetten. Kein Upload, Kopieren per Klick, verlustfrei.

.png
Jetzt testen

SVG in PNG umwandeln: Vektoren im Browser rastern

SVG-Vektordateien direkt im Browser in PNG-Bitmaps rastern. Behält den Alphakanal, steuert die Ausgabegröße. Ohne Upload, ohne Wasserzeichen, ohne Anmeldung.

.svg
Jetzt testen

WebP in JPEG umwandeln: schnell, privat, im Browser

WebP kostenlos im Browser in JPEG umwandeln. Die Dateien verlassen dein Gerät nie, Transparenz wird auf Weiß gelegt, und das JPEG öffnet sich in Programmen, die WebP ablehnen.

.webp
Jetzt testen

MehrJPG

jpg optimizerjpg → pdf

Konvertieren zuBASE64

canvas → base64png → base64
Alle Konverter anzeigen

Funktionen

  • Keine Datei-Uploads erforderlich
  • 100% datenschutzorientiert
  • Browser-basiert
  • Schnelle Verarbeitung
  • Für immer kostenlos

Unterstützte Formate

.jpg .jpeg

Ausgabe: Base64

Technische Spezifikationen

input Format JPEG / JPG (.jpg, .jpeg)
output Format Base64 Data-URI-Text (data:image/png;base64,...)
compression Type Dekodiert und dann verlustfrei als PNG verpackt; kein zweiter verlustbehafteter JPEG-Durchlauf
quality Retention Entspricht dem dekodierten JPEG; keine zusätzliche verlustbehaftete Re-Kompression
color Space Support 8-Bit RGB / RGBA über die Canvas-Pipeline des Browsers
max Resolution Nur durch den Speicher deines Geräts begrenzt
processing Time Sofort, läuft in deinem Browser

Hauptvorteile

  • Spart einen HTTP-Aufruf, indem das Bild direkt in Markup oder Styles eingebettet wird
  • Liefert eine einfügefertige Data-URI, die du mit einem Klick komplett kopierst
  • Läuft zu 100% im Browser, das JPEG wird nie hochgeladen oder gespeichert
  • Kein zweiter verlustbehafteter Kompressionsdurchlauf, die dekodierten Pixel werden verlustfrei verpackt
  • Funktioniert offline, sobald die Seite geladen ist, praktisch in abgeschotteten Netzwerken
  • Die Ausgabe passt direkt in ein HTML-src, CSS-url() oder einen JS-String, ganz ohne Escapen

Häufige Anwendungsfälle

  • Ein kleines Icon oder Logo in eine Einzeldatei-HTML-Seite oder ein E-Mail-Template einbetten
  • Ein CSS-background-image einbinden, ohne eine separate Asset-Datei auszuliefern
  • Einen Platzhalter oder ein Sprite direkt in ein JavaScript-Bundle schreiben
  • Ein Bild in ein Markdown- oder JSON-Dokument einfügen, das keine externen Dateien referenzieren kann
  • Ein kleines Bild als Textfeld in einer Datenbank oder Konfigurationsdatei ablegen
  • Eine Komponente prototypen, ohne einen Asset-Ordner einzurichten
  • Einen in sich geschlossenen Snippet verschicken, der ein Bild ganz ohne Abhängigkeiten rendert

Profi-Tipps

  • Nutze das nur für kleine Bilder, große Fotos inline blähen dein HTML auf und ruinieren das Caching
  • Denk daran, dass der String ~33% größer ist als die Binärdatei, plus den Overhead der PNG-Umverpackung
  • Ein separat gecachtes .jpg schlägt das Inline-Bild meist, wenn es auf mehreren Seiten wiederverwendet wird
  • Komprimiere dein Ausgangs-JPEG vor dem Kodieren, damit der resultierende String kürzer bleibt
  • Lass deinen Server die Antwort mit gzip oder Brotli komprimieren, Base64-Text lässt sich gut über die Leitung packen
  • Lass beim Einfügen den vollständigen data:-Präfix stehen, Browser brauchen ihn, um den MIME-Typ zu erkennen

Häufig gestellte Fragen

Eine einzelne Zeile, die mit `data:image/png;base64,` beginnt, gefolgt von den kodierten Zeichen. Das Tool dekodiert dein JPEG und gibt es als PNG-basierte Data-URI aus, deshalb lautet der MIME-Präfix `image/png`, obwohl du ein JPEG eingespeist hast. Browser stellen sie genau so dar wie jedes Bild in einem `<img>`-Tag oder einem CSS-Hintergrund.
In HTML fügst du ihn in das src-Attribut ein: `<img src="data:image/png;base64,iVBOR...">`. In CSS packst du ihn in url(): `background-image: url(data:image/png;base64,iVBOR...)`. In JavaScript weist du den gesamten String einer Variablen zu oder setzt `element.src` darauf. Zusätzliches Kodieren oder Escapen ist nicht nötig.
Zwei Gründe, die sich addieren. Erstens ist Base64-Text rund 33% größer als die zugrunde liegende Binärdatei, weil jeweils 3 Bytes in 4 ASCII-Zeichen verpackt werden. Zweitens gibt dieses Tool das dekodierte Bild als PNG aus, das die verlustbehaftete fotografische Kompression von JPEG nicht nutzt, also wächst die rohe Byte-Anzahl schon vor der Kodierung. Erwarte einen String, der spürbar schwerer ist als das .jpg, mit dem du gestartet bist.
Es gibt keine zweite Runde verlustbehafteter JPEG-Kompression. Das Tool dekodiert dein JPEG einmal und verpackt genau diese dekodierten Pixel verlustfrei als PNG in der Data-URI, das Ergebnis entspricht also der dekodierten Quelle. Die einzige Kompression, die eine Rolle spielt, ist die, die bereits in deinem ursprünglichen JPEG steckte.
Nein. Ein großes Foto inline zu betten bläht dein HTML oder CSS auf, verhindert, dass das Bild separat gecacht wird, und kann das Rendern der Seite verzögern. Base64-Inlining lohnt sich bei kleinen Bildern wie Icons, Logos, Sprites und Platzhaltern. Echte Fotos behältst du besser als separate .jpg-Dateien, die der Browser cachen und per Lazy-Loading nachladen kann.
Nein. Sowohl das Dekodieren als auch das Kodieren laufen über die Canvas-API in deinem Browser. Die Datei verlässt nie dein Gerät, nichts wird an einen Server geschickt und nichts wird gespeichert. Trenne die Netzwerkverbindung und es funktioniert trotzdem.
Ja, aber mit einem anderen Tool. Diese Seite kodiert nur JPEG zu Base64. Für den umgekehrten Weg nutzt du einen Base64-zu-Bild-Konverter, der eine Data-URI oder rohes Base64 annimmt und eine Bilddatei ausgibt.
Keine feste Grenze durch das Format selbst, nur der verfügbare Speicher deines Geräts, da das gesamte Bild dekodiert und im Browser gehalten wird. Sehr große Dateien erzeugen sehr lange Strings, die sich langsam in einen Editor einfügen lassen. Kleine Bilder sind für das Inlining ohnehin der ideale Fall.