Zum Hauptinhalt springen

SVG-Vektorisierer

Der SVG-Vektorisierer wandelt einfache Logos, Symbole und Schriftzüge in bearbeitbare SVG-Pfade um. Stellen Sie Farbanzahl, Vereinfachung, Eckenschwelle und Transparenzgrenze ein; Änderungen aktualisieren die Vorschau. Das Bild wird im Browser verarbeitet, die Vektorisierung läuft in einem lokalen Web Worker und die Datei wird nicht hochgeladen.

Nur lokal

Bild hier ablegen

oder irgendwo auf der Seite ablegen · Datei auswählen · 100 MB

Unterstützt: JPG, JPEG, PNG, WebP, AVIF, HEIC, HEIF, GIF, BMP

Das Bild wird in diesem Tab dekodiert, vektorisiert und gezeichnet. Dieses Werkzeug hat keinen Server, es gibt also nichts aufzuräumen und keine Aufbewahrungsrichtlinie zu lesen.

Wie funktioniert SVG-Vektorisierer?

Das Bild wird für die Verarbeitung auf höchstens 900 Pixel an der längeren Seite verkleinert. Ein eigener mehrfarbiger Algorithmus reduziert die Pixel auf eine kleine Palette und ermittelt die Grenzen der Farbflächen. Die Berechnung läuft in einem lokalen Web Worker.

Die gerichteten Kanten werden zu geschlossenen Konturen verbunden. Alle Konturen einer Farbe werden in einem Pfad zusammengefasst; `fill-rule="evenodd"` erhält dabei Löcher innerhalb der Form. Vollständig transparente Pixel werden unabhängig vom Schwellenwert ausgeschlossen.

Douglas–Peucker vereinfacht die Konturen entsprechend der gewählten Toleranz. Die Eckenschwelle steuert, welche sanften Richtungsänderungen geglättet werden und welche Ecken erhalten bleiben. Eine stärkere Vereinfachung verringert die Knotenzahl, kann aber kleine Details verändern.

Der SVG-Export enthält bearbeitbare Pfade ohne eingebettetes Rasterbild. Flache Grafiken eignen sich besser als Fotos: Farbverläufe und Bildrauschen erzeugen viele Konturen. Senken Sie bei komplexen Ergebnissen die Farbanzahl oder erhöhen Sie die Vereinfachung und prüfen Sie die Vorschau.

Originalbild und Vektorisierungseinstellungen

logo.png · 1200 × 400
Farben 2
Vereinfachung 1.2px
Eckenschwelle 60°

Erzeugtes SVG

<svg xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 900 300" width="900" height="300">
  <path fill="#1b1b1f" fill-rule="evenodd" d="M10 10H890V290H10ZM100 100V200H800V100Z"/>
</svg>

Welche Optionen und Sonderfälle unterstützt SVG-Vektorisierer?

Technische Referenz und Optionen
ParameterTypStandardVerhalten & Sonderfälle
Farben2–82Legt die Größe der reduzierten Palette fest. Weniger Farben erzeugen meist weniger und einfachere Pfade.
VereinfachungPixel1,2Legt die Toleranz für das Entfernen von Konturpunkten fest. Höhere Werte verringern die Knotenzahl, niedrigere erhalten mehr Details.
EckenschwelleGrad60°Sanftere Richtungsänderungen werden geglättet, stärkere bleiben Ecken. Ein höherer Wert glättet mehr Konturstellen.
Alpha-Schwelle0–2558Pixel unterhalb dieser Deckkraft werden ausgeschlossen. Vollständig transparente Pixel werden auch bei Schwellenwert 0 nie vektorisiert.
Ebenenreihenfolge umkehrenUmschalterinaktivKehrt die Zeichenreihenfolge der Farbflächen um. Die RGB-Farben selbst werden dabei nicht invertiert.
Arbeitsgrößehöchstens 900 pxbegrenztBegrenzt die längere Bildseite auf 900 Pixel vor der Vektorisierung. Das SVG verwendet die Koordinaten dieses Arbeitsbilds.

Häufig gestellte Fragen

Wie wandle ich ein PNG-Logo in SVG um?

Wählen Sie das Bild und beginnen Sie mit zwei oder drei Farben. Das Tool aktualisiert die Vektorisierung automatisch. Verringern Sie die Vereinfachung, wenn Details fehlen, oder erhöhen Sie sie, wenn das SVG zu viele Knoten enthält. Prüfen Sie das Ergebnis vor dem Download.

Warum wird ein fotografiertes Logo schlechter vektorisiert?

Beleuchtung, Schatten und Bildrauschen erzeugen viele ähnliche Farben und unregelmäßige Kanten. Eine saubere Originalgrafik mit flachen Farben liefert meist bessere Konturen. Bei Fotos können Sie die Farbanzahl senken; das Ergebnis bleibt eine vereinfachte Darstellung.

Kann ich das SVG in Illustrator oder Figma bearbeiten?

Ja. Die Ausgabe enthält gewöhnliche `<path>`-Elemente mit Füllfarben und `fill-rule="evenodd"`, ohne eingebettetes Rasterbild. Sie können Formen, Farben und Knoten in geeigneten Vektorprogrammen bearbeiten. Die Knotenzahl hängt von der Vorlage und der Vereinfachung ab.

Was passiert mit transparenten Pixeln?

Vollständig transparente Pixel werden immer ausgeschlossen. Die Alpha-Schwelle entfernt zusätzlich Pixel mit geringerer Deckkraft als der eingestellte Wert. Bei 0 werden auch sehr schwache, aber nicht vollständig transparente Pixel berücksichtigt.

Wird mein Bild hochgeladen?

Nein. Der Browser dekodiert das Bild und erstellt das Arbeitsbild lokal auf Canvas. Ein lokaler Web Worker berechnet die SVG-Konturen. Der Inhalt der Bilddatei wird nicht an einen Server gesendet; Sie können die Anfragen in der Netzwerkansicht der Entwicklertools prüfen.

Warum enthält das SVG so viele Knoten?

Fotos, Farbverläufe und unruhige Kanten erzeugen viele Konturen. Weniger Farben und eine höhere Vereinfachung können die Datei verkleinern, verändern aber möglicherweise Details. Vergleichen Sie die Vorschau nach jeder Änderung.