Daten-URI für HTML und CSS
Erstelle eine Zeichenfolge wie data:image/...;base64 für die Quelle eines img-Elements in HTML oder background-image in CSS. Mit Bildpräfix wechselst du zwischen einer Daten-URI und reinem Base64.
Bild in Base64 umwandeln
Wandle ein Bild in Base64 um oder kopiere eine Daten-URI für HTML und CSS.
Konvertierungsmodus
Weitere Aktionen
Base64-Zeichentabelle
Base64 verwendet 64 Zeichen: A–Z, a–z, 0–9, + und /. Das Zeichen = dient zum Auffüllen.
Klicke auf einen Wert, um ihn zu kopieren.
| Index | Binär | Zeichen |
|---|---|---|
| 0 | A | |
| 1 | B | |
| 2 | C | |
| 3 | D | |
| 4 | E | |
| 5 | F | |
| 6 | G | |
| 7 | H | |
| 8 | I | |
| 9 | J | |
| 10 | K | |
| 11 | L | |
| 12 | M | |
| 13 | N | |
| 14 | O | |
| 15 | P |
| Index | Binär | Zeichen |
|---|---|---|
| 16 | Q | |
| 17 | R | |
| 18 | S | |
| 19 | T | |
| 20 | U | |
| 21 | V | |
| 22 | W | |
| 23 | X | |
| 24 | Y | |
| 25 | Z | |
| 26 | a | |
| 27 | b | |
| 28 | c | |
| 29 | d | |
| 30 | e | |
| 31 | f |
| Index | Binär | Zeichen |
|---|---|---|
| 32 | g | |
| 33 | h | |
| 34 | i | |
| 35 | j | |
| 36 | k | |
| 37 | l | |
| 38 | m | |
| 39 | n | |
| 40 | o | |
| 41 | p | |
| 42 | q | |
| 43 | r | |
| 44 | s | |
| 45 | t | |
| 46 | u | |
| 47 | v |
| Index | Binär | Zeichen |
|---|---|---|
| 48 | w | |
| 49 | x | |
| 50 | y | |
| 51 | z | |
| 52 | 0 | |
| 53 | 1 | |
| 54 | 2 | |
| 55 | 3 | |
| 56 | 4 | |
| 57 | 5 | |
| 58 | 6 | |
| 59 | 7 | |
| 60 | 8 | |
| 61 | 9 | |
| 62 | + | |
| 63 | / |
Ähnliche Tools
Deine Statistiken
0
Konvertierungen
0
Kopiervorgänge
0
Verarbeitete zeichen
Text
Häufigster modus
0
Ø grösse
100%
Nutzungswert
So wandelst du ein Bild in Base64 um
Das Video konnte nicht geladen werden. Du kannst weiterhin der Anleitung unten folgen.
Das Video zeigt die englische Oberfläche.
Beim Öffnen des Tools ist Bild kodieren ausgewählt. Klicke auf Importieren oder Dateien auswählen und wähle ein Bild aus. Prüfe in der Vorschau, ob es die richtige Datei ist. Die Originaldatei bleibt unverändert. Base64 erzeugt Text, der größer als die Bilddatei sein kann.
Optionen für Bilder in Base64
Unterstützte Bilddateien
Kodiere JPG, PNG, GIF, WebP, AVIF, BMP oder ICO. SVG-Dateien kannst du auf der Seite ablegen. HEIC und HEIF werden beim Import zu JPEG. Bei TIFF wird das erste Bild als PNG übernommen.
Kodieren und dekodieren
Kodiere ein importiertes Bild oder stelle Bilddaten aus Base64 wieder her. Bild kodieren lädt Text herunter. Bild dekodieren lädt das angezeigte Bild herunter, sofern die Vorschau geladen werden konnte.
3 weitere anzeigenWeniger anzeigen
Bilder aus der Zwischenablage
Im Modus Bild kodieren liest Einfügen ein kopiertes Bild aus der Zwischenablage, sofern dein Browser den Zugriff erlaubt.
Import bis 50 MiB
Bilddateien dürfen höchstens 50 MiB groß sein. Ob die Vorschau erscheint, hängt außerdem von der Formatunterstützung des Browsers und dem verfügbaren Speicher ab.
Konvertierung im Browser
Lies ein importiertes Bild als Base64-Text aus. Bei gängigen Eingabeformaten bleiben die ursprünglichen Bytes der Datei erhalten.
Häufige Fragen
Wie wandle ich ein Bild in Base64 um?
Wähle Bild kodieren und füge dein Bild hinzu. Aktiviere Bildpräfix für eine vollständige Daten-URI oder schalte es für reines Base64 aus. Kopiere das Ergebnis oder lade es als Textdatei herunter.
Wie verwende ich ein Base64-Bild in HTML oder CSS?
Aktiviere Bildpräfix und kopiere einen Wert wie data:image/png;base64,... in das src-Attribut eines img-Elements in HTML oder in background-image: url(...) in CSS.
Wie wandle ich Base64 wieder in ein Bild um?
Wähle Bild dekodieren und gib die Base64-Bilddaten mit oder ohne Daten-URI-Präfix ein. Wenn dein Browser das wiederhergestellte Format anzeigen kann, prüfe die Vorschau und speichere das Bild mit Herunterladen.
Welche Bildformate kann ich importieren?
Die Dateiauswahl akzeptiert JPG, PNG, GIF, WebP, AVIF, BMP, TIFF, ICO, HEIC und HEIF. SVG kannst du auf der Seite ablegen. HEIC und HEIF werden zu JPEG, das erste TIFF-Bild zu PNG. Bei anderen unterstützten Eingabeformaten bleiben die ursprünglichen Bytes erhalten. Die Importgrenze beträgt 50 MiB.
2 weitere anzeigenWeniger anzeigen
Sollte ich große Bilder als Base64 direkt in die Seite einbetten?
Base64 verwendet vier Zeichen für jeweils drei Eingabebytes und bei Bedarf zusätzliche Füllzeichen. Große Daten werden dadurch etwa ein Drittel größer. Ein eingebettetes Bild lässt sich außerdem nicht als separate Datei zwischenspeichern. Nutze für große oder mehrfach verwendete Bilder normale Bilddateien.
Wird mein Bild hochgeladen?
Kodierung und Dekodierung laufen in deinem Browser, ohne die Eingabe an einen Konvertierungsserver zu senden. Nutzungszähler können nach dem Schließen des Tabs lokal gespeichert bleiben.
Technische Details
Textkodierung mit UTF-8
TextEncoder wandelt Text in UTF-8-Bytes um, bevor btoa daraus Base64 erstellt. Die Dekodierung verwendet atob und TextDecoder. Importierte Textdateien werden als UTF-8 gelesen. Ungültige UTF-8-Bytefolgen werden durch Ersatzzeichen ersetzt. Bilder haben einen eigenen Importablauf.
Wo die Konvertierung stattfindet
Der Textmodus verarbeitet UTF-8-Bytes. Bild kodieren liest die Daten des importierten Bildes. Bild dekodieren prüft die zurückgewonnenen Daten mit dem Bilddecoder des Browsers.
4 weitere anzeigenWeniger anzeigen
Bildformate und Konvertierung
Bild kodieren erhält die Bytes gängiger Bildformate. HEIC- und HEIF-Bilder werden zunächst mit dem Browser dekodiert, sofern möglich, sonst mit libheif. Daraus entsteht JPEG. Bei TIFF wandelt UTIF das erste Bild in PNG um. Bild dekodieren übergibt das zurückgewonnene Bild an den Bilddecoder des Browsers.
Verarbeitung und Speicher
Textkonvertierung und Base64-Prüfung laufen in einem Browser-Worker. Große Eingaben und Ergebnisse belegen weiterhin Speicher. Bildvorschauen benötigen zusätzlich Speicher für dekodierte Pixel. Lange Texte erscheinen als schreibgeschützte Vorschau. Das vollständige Ergebnis bleibt kopierbar und kann heruntergeladen werden.
Daten-URIs für HTML und CSS
Bildpräfix erstellt eine Daten-URI wie data:image/png;base64,... für das src-Attribut eines HTML-img-Elements oder einen url()-Wert in CSS. Die Ausgabe mit Präfix verwendet immer das Standard-Base64-Alphabet, Füllzeichen und eine einzige Zeile ohne Umbruch. Schalte das Präfix aus, um reines Base64 und die Ausgabevariante URL-sicher zu nutzen.
Text und Bilder eingeben
Wähle zuerst den Konvertierungsmodus. Tippe oder füge Text ein, importiere eine Textdatei oder lege ein Bild im Modus Bild kodieren ab. Über Einfügen im Modus Bild kodieren liest du Bilder aus der Zwischenablage ein, sofern dein Browser dies erlaubt. Per Drag-and-drop werden TXT, JSON und XML angenommen. Die Dateiauswahl bietet zusätzlich CSV, HTML, CSS und JavaScript an.