Advanced Background Optimization

Intelligente Optimierung

Entfernt automatisch unnötige Leerzeichen, Kommentare und Attribute, um die Dateigröße zu minimieren und gleichzeitig die SVG-Qualität zu erhalten.

Mehrere Formate

Wählen Sie zwischen URL-kodiertem Data URI (kleiner) oder Base64-Kodierung (bessere Kompatibilität) je nach Bedarf.

Live-Vorschau

Sehen Sie Ihr SVG in Echtzeit als CSS-Hintergrund gerendert, um sicherzustellen, dass es perfekt aussieht, bevor Sie es verwenden.

Verwendung

Fügen Sie Ihren SVG-Code in das Eingabefeld ein oder tippen Sie ihn ein

Wählen Sie das Ausgabeformat und aktivieren Sie bei Bedarf die Optimierung

Sehen Sie sich den generierten CSS-Code und die Vorschau an

Kopieren oder laden Sie das CSS zur Verwendung in Ihrem Projekt herunter

Technical Integration

Simply paste the generated CSS as a background-image property in your stylesheet. This allows you to use high-resolution, scaleable icons without external HTTP requests, improving performance and SEO.

FAQ

Häufig Gestellte Fragen

Was ist eine SVG Data URI?

Eine Data URI ist eine Möglichkeit, SVG-Code direkt in CSS unter Verwendung des data:-Schemas einzubetten. Dies eliminiert die Notwendigkeit separater SVG-Dateien und reduziert HTTP-Anfragen.

Welches Format sollte ich verwenden - Data URI oder Base64?

URL-kodierte Data URI ist im Allgemeinen besser, da sie lesbarer und oft kleiner ist. Verwenden Sie Base64, wenn Sie bessere Kompatibilität mit älteren Systemen oder bestimmten Tools benötigen.

Beeinflusst die Optimierung die SVG-Qualität?

Nein! Die Optimierung entfernt nur unnötige Leerzeichen, Kommentare und redundante Attribute. Das visuelle Erscheinungsbild Ihres SVG bleibt genau gleich.

Kann ich dies für jedes SVG verwenden?

Ja! Dieses Tool funktioniert mit jedem gültigen SVG-Code. Sehr komplexe SVGs mit eingebetteten Bildern oder Animationen können jedoch zu großen CSS-Dateien führen.