SVG zu Base64

Mit diesem kostenlosen SVG-zu-Base64-Konverter wandelst du jedes Scalable Vector Graphics-Bild in einen Base64-String oder ein fertiges Code-Snippet um. Wähle eine lokale .svg-Datei aus (oder füge einen Link zu einer entfernten Datei ein), wähle das Ausgabeformat und klicke auf SVG in Base64 kodieren.

SVG-Datei
SVG-Datei hierher ziehen oder auswählen

So wandelst du SVG zu Base64 online um

  1. Wähle Lokale Datei und eine .svg-Datei aus, oder wähle Remote-URL und füge einen Link ein.
  2. Wähle das Ausgabeformat: reines Base64, Data-URI, HTML-Tag, CSS, JavaScript, JSON oder XML.
  3. Klicke auf SVG in Base64 kodieren. Das Ergebnis erscheint sofort mit Vorschau.
  4. Kopiere das Ergebnis in die Zwischenablage oder lade es als .txt-Datei herunter.

Über SVG (Scalable Vector Graphics)

SVG ist ein XML-basiertes Vektorformat: Formen werden mit Text statt mit Pixeln beschrieben, sodass das Bild in jeder Größe scharf bleibt. Ideal für Icons, Logos und Illustrationen.

Da SVG bereits Text ist, kannst du es auch URL-kodiert statt in Base64 einbetten, was oft kleiner ist. Base64 bleibt aber die sicherste Wahl, wenn das Markup Anführungszeichen oder Zeichen enthält, die dein CSS oder HTML beschädigen würden.

Entwickelt2001, W3C
TypVektor (XML-Text)
TransparenzJa
AnimationJa (SMIL / CSS)
Beginnt mit<svg oder <?xml

Ausgabeformate

Wähle, wie das Ergebnis verpackt werden soll. Der Konverter kann Folgendes liefern:

  • txt: nur den Base64-String, bereit zum Einfügen in Code, ein Datenbankfeld oder eine API-Anfrage.
  • uri: eine vollständige data:-URI, die du in die Adressleiste des Browsers einfügen oder überall dort verwenden kannst, wo eine URL akzeptiert wird.
  • html img: ein <img>-Tag mit der Data-URI in src.
  • css background image: eine CSS-Regel mit background-image: url(data:...).
  • html favicon: ein <link rel="icon">-Tag für ein eingebettetes Favicon.
  • html hyperlink: einen <a>-Link, der die eingebettete Datei herunterlädt oder öffnet.
  • html iframe: einen <iframe>, der den Inhalt inline darstellt.
  • javascript image: JavaScript, das ein Image-Objekt erzeugt.
  • javascript popup: JavaScript, das den Inhalt in einem neuen Fenster öffnet.
  • json: ein JSON-Objekt mit Dateiname, MIME-Typ und Daten.
  • xml: ein XML-Element mit den Daten in einem CDATA-Abschnitt.

Ist das sicher und wie groß wird das Ergebnis?

Deine Datei wird nie hochgeladen: Sie wird lokal von deinem Browser über die File API gelesen und umgewandelt, sodass selbst vertrauliche Dokumente auf deinem Gerät bleiben.

Base64 stellt je 3 Bytes mit 4 Zeichen dar, daher ist das kodierte Ergebnis etwa 33 % größer als die Originaldatei (plus ein paar Bytes für Padding und das Data-URI-Präfix).

Häufige Fragen

Wie wandle ich SVG in Base64 um?

Wähle oben deine .svg-Datei aus und klicke auf "SVG in Base64 kodieren". Der Konverter liest die Datei in deinem Browser und gibt den Base64-String oder eine fertige Data-URI aus.

Womit beginnt ein Base64-kodiertes SVG?

Eine in Base64 kodierte SVG-Datei beginnt typischerweise mit "PHN2Zy / PD94bWwg". Als Data-URI beginnt sie mit "data:image/svg+xml;base64,".

Gibt es eine Begrenzung der Dateigröße?

Es gibt kein festes Limit, da die Umwandlung lokal läuft, aber sehr große Dateien erzeugen sehr lange Strings. Dateien bis etwa 50 MB funktionieren in modernen Browsern problemlos.

Wie wandle ich das Base64 zurück in SVG um?

Nutze den Decoder Base64 zu SVG: Füge den String ein, dann kannst du die originale .svg-Datei ansehen und herunterladen.

Verwandte Tools und Anleitungen

Kommentare (0)

Fragen, Ideen oder ein Fehler in „SVG zu Base64“? Schreib einen Kommentar, bewerte das Tool oder antworte anderen.

Noch keine Kommentare. Teile als Erste(r) dein Feedback!

Kommentar schreiben

Bewerte dieses Tool:
Esc
↑ ↓ bewegen↵ öffnenEsc schließen