Was ist eine SVG-Datei? (Und wie du sie öffnest, nutzt und erstellst)

Eine SVG-Datei (Scalable Vector Graphics) ist ein Bild, das aus Mathematik und Code besteht statt aus einem Raster von Pixeln. Weil es ein Bild als Formen speichert (Linien, Kurven und Füllungen) und nicht als farbige Punkte, bleibt es in jeder Größe scharf, vom winzigen App-Icon bis zur großen Plakatwand, und die Datei ist meistens klein. Wahrscheinlich bist du SVGs schon als Logos, Website-Icons oder Cricut-Schnittdateien begegnet.

Das ist ein einfacher Leitfaden für alle, die gerade zum ersten Mal über so eine Datei stolpern: was ein SVG eigentlich ist, was darin steckt, wofür es gut und weniger gut geeignet ist, wie du eines öffnest und wie du aus einem Bild, das du schon hast, ein SVG erstellst. Webentwicklungs-Wissen brauchst du dafür nicht.

Die Kurzfassung

• Ein SVG speichert ein Bild als Formen, die in Code beschrieben sind, nicht als Pixel. Deshalb skaliert es auf jede Größe, ohne unscharf zu werden.
• Es eignet sich hervorragend für Logos, Icons, einfache Illustrationen und Cricut- oder Druckprojekte. Für Fotos ist es schlecht geeignet.
• Öffnen kannst du es in jedem Webbrowser, in einer Design-App (Illustrator, Inkscape, Figma, Canva) oder sogar in einem einfachen Texteditor.
• Erstellen kannst du es, indem du es in Vektorsoftware gestaltest oder indem du ein Bild, das du schon hast, in ein SVG konvertierst.

SVG vs. ein normales Bild (PNG oder JPG)

Ein PNG oder JPG ist ein Rasterbild: ein festes Raster aus farbigen Pixeln, wie ein Mosaik. Zoomst du weit genug hinein, siehst du die Quadrate. Genau deshalb wird ein Logo, das als PNG gespeichert wurde, unscharf, wenn du es stark vergrößerst.

Ein SVG ist ein Vektorbild: eine Sammlung von Anweisungen wie "zeichne hier einen Kreis, fülle ihn orange, zeichne dort diese Kurve." Weil das Bild jedes Mal aus diesen Anweisungen neu gezeichnet wird, sieht es in jeder Größe scharf aus. Dieser eine Unterschied ist der ganze Reiz. (Eine ausführliche Einordnung, wann du welches Format verwenden solltest, findest du in PNG vs SVG.)

Was tatsächlich in einer SVG-Datei steckt

Hier kommt der Teil, der viele überrascht: Ein SVG ist Text. Öffnest du eines in Notepad oder einem beliebigen Code-Editor, kannst du es lesen. Unter der Haube ist es XML, ein Textformat mit Tags, bei dem jede Form eine Codezeile ist. Ein einfaches SVG mit einem orangefarbenen Kreis sieht so aus:

<svg viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="orange" />
</svg>

Das ist die ganze Datei. circle zeichnet die Form, cx/cy platzieren sie, r legt den Radius fest und fill setzt die Farbe. Weil es reiner Text ist, ist ein SVG winzig, ein Browser kann es sofort rendern, und du kannst eine Farbe ändern, indem du ein einziges Wort austauschst. SVG ist ein offener Standard, den das W3C seit den späten 1990ern pflegt, und jeder moderne Browser unterstützt ihn.

Wofür SVGs verwendet werden

SVGs glänzen überall dort, wo eine Grafik in verschiedenen Größen scharf bleiben oder als Formen bearbeitbar sein muss:

• Logos. Ein SVG funktioniert auf einer Visitenkarte genauso wie auf einem Banner, ohne dass du für jede Größe eine separate Datei brauchst.
• Website-Icons und Grafiken. Buttons, Pfeile und einfache Illustrationen bleiben auf jedem Bildschirm scharf und laden schnell.
• Cricut und Schneidemaschinen. SVG ist das Standardformat für Schnittdateien. Die Maschine folgt den Pfaden, um Vinyl, Papier oder HTV zu schneiden. (SVG-Dateien für Cricut vorbereiten erklärt den gesamten Ablauf.)
• Druck und Beschilderung. Ein Vektor skaliert auf jede physische Größe, ohne zu verpixeln.

Wofür SVGs nicht gut geeignet sind

SVGs sind für flache, grafische Kunst gemacht und deshalb für Fotografien schlecht geeignet. Ein Foto besteht aus Millionen fein gemischter Farben ohne flache Bereiche. Zwingst du es in Formen, bekommst du entweder eine posterisierte, gemäldeartige Version oder eine riesige, unübersichtliche Datei. Wenn du überlegst, ein Foto zu vektorisieren, lies zuerst, was wirklich passiert, wenn du ein Foto in SVG konvertierst. Für echte fotografische Details bleib bei JPG oder PNG.

Wie du eine SVG-Datei öffnest

Du hast drei einfache Optionen, je nachdem, was du tun willst:

• Nur ansehen: Zieh die Datei in einen beliebigen Webbrowser. Sie wird sofort gerendert, ganz ohne zusätzliche Software.
• Visuell bearbeiten: Öffne sie in einer Design-App wie Inkscape (kostenlos), Illustrator, Figma oder Canva. (Wie du ein SVG bearbeitest zeigt dir, wie du Farben änderst und Formen anpasst.)
• Code ansehen oder anpassen: Öffne sie in einem einfachen Texteditor wie Notepad oder VS Code.

Eine Sache führt oft zu Verwirrung: Windows File Explorer zeigt standardmäßig keine Vorschau für SVGs an, daher sieht die Datei im Ordner leer aus. Das heißt nicht, dass sie kaputt ist. Öffne sie im Browser, dann wird sie korrekt angezeigt.

Wie du ein SVG erstellst

Es gibt zwei Wege, und welcher der richtige ist, hängt davon ab, womit du startest.

Von Grund auf gestalten. Zeichne dein Logo, Icon oder deine Illustration in Vektorsoftware (Inkscape, Illustrator, Figma oder Canva) und exportiere es als SVG. Das liefert dir das sauberste Ergebnis, weil die Datei von Anfang an ein Vektor war.

Ein Bild konvertieren, das du schon hast. Das ist es, was die meisten Menschen tatsächlich brauchen. Wenn dein Logo oder Artwork nur als PNG oder JPG existiert, machst du daraus ein SVG, indem du es vektorisierst. Dabei werden die Pixel als bearbeitbare Formen neu aufgebaut. (Was Bildvektorisierung ist erklärt den Prozess.)

Wie das mit PerfectVector aussieht

Wenn du ein PNG oder JPG hast und ein echtes SVG brauchst, ist das der Konvertierungsweg, und genau das macht PerfectVector. Lade ein Logo, Icon oder eine flache Illustration hoch, und PerfectVector baut das Artwork als sauberes SVG mit niedriger Knotenzahl und bearbeitbaren Farben neu auf, bereit fürs Web, den Druck oder eine Schneidemaschine. Du kannst dein Bild in ein SVG verwandeln und das Ergebnis selbst prüfen. Konvertiere deine ersten Bilder kostenlos, ohne Kreditkarte.

Am besten funktioniert es mit denselben Dingen, für die SVG selbst gut ist: flache, grafische Kunst und Logos. Bei einem detailreichen Foto wird dir kein Konverter einen echten fotografischen Vektor liefern, und wir sagen dir das lieber ehrlich, statt so zu tun, als wäre es anders.

Ein kurzer Sicherheitshinweis

Weil ein SVG Code enthalten kann, kann es theoretisch ein Skript mitbringen, ähnlich wie eine Webseite. Ein SVG in einem Browser oder einer Design-App anzusehen ist sicher, und SVGs aus Quellen, denen du vertraust, sind in Ordnung. Behandle ein zufälliges SVG aus unbekannter Quelle einfach so, wie du jede unbekannte Datei behandeln würdest, und binde keines in deine Website ein, ohne zu wissen, woher es stammt.

FAQ

Wofür wird eine SVG-Datei verwendet? Für Logos, Website-Icons, Buttons, einfache Illustrationen und Schnittdateien für Maschinen wie Cricut. Überall dort, wo eine Grafik in verschiedenen Größen scharf bleiben oder als Formen bearbeitbar sein muss, ist ein SVG eine starke Wahl. Im Web wird es häufig verwendet, weil die Dateien klein sind und ohne Qualitätsverlust skalieren.

Wie öffne ich eine SVG-Datei? Zieh sie in einen beliebigen Webbrowser, um sie anzusehen, öffne sie in einer Design-App wie Inkscape, Illustrator, Figma oder Canva, um sie visuell zu bearbeiten, oder öffne sie in einem Texteditor wie Notepad, um den Code zu sehen. Beachte, dass Windows File Explorer standardmäßig keine Vorschau für SVGs zeigt. Ein leer wirkendes Icon bedeutet also nicht, dass die Datei kaputt ist.

Wie erstelle ich eine SVG-Datei? Entweder gestaltest du sie in Vektorsoftware (Inkscape, Illustrator, Figma oder Canva) und exportierst sie als SVG, oder du konvertierst ein Bild, das du schon hast, zum Beispiel ein PNG- oder JPG-Logo, indem du es vektorisierst. Von Grund auf zu gestalten liefert das sauberste Ergebnis; Konvertieren ist der schnelle Weg, wenn du nur eine Rasterdatei hast.

Ist eine SVG-Datei eine Vektordatei? Ja. SVG steht für Scalable Vector Graphics und speichert Bilder als Vektorformen statt als Pixel. Genau deshalb skaliert es auf jede Größe, ohne Qualität zu verlieren.

Was ist der Unterschied zwischen einem SVG und einem PNG oder JPG? Ein PNG oder JPG besteht aus Pixeln und wird unscharf, wenn du es über seine Auflösung hinaus vergrößerst. Ein SVG besteht aus Formen und bleibt in jeder Größe scharf. PNG und JPG sind besser für Fotos; SVG ist besser für Logos, Icons und Grafiken.

Kann ich eine SVG-Datei in Microsoft Word oder Office öffnen? Ja. Microsoft 365 und neuere Office-Versionen können SVG-Dateien einfügen und sie sogar direkt im Dokument umfärben oder umgestalten. Das ist praktisch für Logos und Icons in Berichten und Präsentationen.

---

Ein SVG ist einfach ein Bild, das aus Formen und Code statt aus Pixeln aufgebaut ist. Genau deshalb bleibt es überall scharf und weiterhin bearbeitbar. Wenn deines bisher nur als PNG oder JPG existiert, konvertiere es in ein sauberes SVG, und du hast eine Datei, die du skalieren, umfärben und schneiden kannst, ohne dass sie jemals unscharf wird.