Kategorie: Entwicklung

Data-URI-Generator

Eigene IdeeTool fehlt?

Text oder eine Datei in eine data:-URI umwandeln

Text einfügen oder eine Datei auswählen, den Medientyp festlegen und eine data:-URI erhalten, die sich direkt in CSS, HTML oder JSON einbetten lässt. Die Datei wird vollständig im Browser gelesen und kodiert und verlässt Ihr Gerät nie.

Ausgabe
data:text/plain;base64,SGVsbG8sIHdvcmxkIQ==

Alles auf dieser Seite wird in Ihrem Browser verarbeitet. Nichts wird hochgeladen.

Wozu dieses Werkzeug dient

Eine data:-URI bettet die Bytes einer Datei direkt in eine URL ein, sodass ein kleines Icon oder eine Schriftart innerhalb eines Stylesheets statt als separate Anfrage ausgeliefert werden kann. Dieses Tool erstellt eine solche URI entweder aus eingegebenem Text oder einer ausgewählten Datei: Dateien werden immer base64-kodiert, da rohe Bytes eine Prozent-Kodierung selten unbeschadet überstehen, während Text auf beide Arten kodiert werden kann. Es wird nichts hochgeladen — die Datei wird mit der browsereigenen FileReader-API gelesen und die Kodierung läuft lokal ab.

So funktioniert es

  1. Text oder eine Datei als Quelle wählen.
  2. Den Medientyp anpassen, falls der erkannte nicht passt.
  3. Die erzeugte data:-URI kopieren.

Datenschutz

Dieses Werkzeug läuft vollständig in Ihrem Browser. Ihre Eingabe wird nie hochgeladen, gespeichert oder weitergegeben – beim Schließen des Tabs ist sie weg.

Häufig gestellte Fragen

Wird die Datei auf einen Server hochgeladen?
Nein. Die Datei wird von Ihrem Browser gelesen und kodiert; es wird nichts irgendwohin gesendet.
Warum wird eine Datei immer base64-kodiert?
Beliebige Binärbytes überstehen eine Prozent-Kodierung nicht sauber, daher ist Base64 bei Dateien die zuverlässige Option. Reiner Text kann beides verwenden.
Gibt es eine Größenbeschränkung?
Nur die praktische: Sehr große data:-URIs machen das umgebende CSS oder HTML schwerer, daher eignet sich dies am besten für kleine Assets wie Icons oder kurze Ausschnitte.