SVG zu CSS

SVG-Markup in eine optimierte CSS-background-image-Data-URI umwandeln, URL-kodiert oder Base64, mit Live-Vorschau. Kostenloses SVG-zu-CSS-Tool.

Über dieses Werkzeug

Wandle SVG-Markup in eine Data-URI für CSS-background-image um. URL-Kodierung hält das Ergebnis kurz und lesbar; Base64 steht ebenfalls zur Verfügung.

So funktioniert es

  1. Füge dein SVG ein.
  2. Wähle URL-kodiert oder Base64.
  3. Kopiere die CSS-Deklaration und prüfe die Vorschau.

Häufige Fragen

URL-kodiert oder Base64?

URL-kodiertes SVG ist meist kleiner und bleibt lesbar. Base64 ist sicherer in Werkzeugen, die Sonderzeichen falsch behandeln.

Warum wurde xmlns hinzugefügt?

SVG als Data-URI braucht xmlns="http://www.w3.org/2000/svg", um dargestellt zu werden; fehlt es, wird es ergänzt.

Wird Leerraum entfernt?

Ja. Zeilenumbrüche und überflüssige Leerzeichen zwischen Tags werden zusammengefasst, um das Ergebnis zu verkürzen.

Verwandte Werkzeuge