So wandelst du ein Logo in SVG um

Die kurze Antwort

Zieh dein Logo in das Tool unten. Die Vorgabe Logo reduziert es auf seine Hauptfarben und zeichnet jede Farbfläche als glatte Umrisse nach. Original und SVG erscheinen nebeneinander; zoome in beide hinein, um die Kurven zu prüfen, und klick dann auf SVG herunterladen.

Steht das Logo auf einem weißen oder einfarbigen Rechteck, hak Hintergrund entfernen an. Der Hintergrund, der die Bildränder berührt, wird transparent, die gleiche Farbe innerhalb des Logos, etwa das Loch eines O, bleibt gefüllt. Hast du nur ein JPG, ist das kein Problem: Das Tool glättet das JPG-Rauschen an den Kanten.

Was sich ändert, wenn ein Logo zum SVG wird

Ein PNG oder JPG ist ein Raster aus farbigen Quadraten. In seiner eigenen Größe sieht es gut aus, aber vergrößert für ein Banner, eine Fahrzeugbeschriftung oder einen großen Druck werden die Kanten weich oder treppig. Ein SVG speichert dagegen Formen: Jeder Umriss wird mit Linien und Kurven beschrieben und mit Farbe gefüllt, deshalb lässt er sich in jeder Größe scharf darstellen.

Vektorisieren ist der Schritt von der ersten Dateiart zur zweiten. Das Tool schaut sich die Pixel an, entscheidet, welche Farben zusammengehören, folgt dem Rand jeder Fläche und legt Kurven daran an. Das Ergebnis ist keine Kopie der Originaldatei, sondern eine Neuzeichnung. Deshalb ergibt ein sauberes Ausgangsbild ein sauberes Ergebnis.

Welche Bilder sich gut umwandeln lassen

Je sauberer und flacher die Vorlage, desto besser das SVG. Logos mit wenigen Vollfarben, Icons, Stempel, Handlettering und gescannte Tuschezeichnungen werden zu ordentlichen Formen. Verläufe, Schatten, Texturen und Fotos haben keine klaren Ränder, deshalb muss das Tool sie in Streifen aus flachen Farben aufteilen.

Wähl die Vorgabe, die zum Bild passt. Sie setzt sinnvolle Werte für Farben, Detail und Glättung, und du kannst jeden davon danach noch ändern.

Das Ergebnis feinjustieren

Farben legt fest, wie viele Farben das SVG höchstens verwenden darf. Bei Logos werden fast gleiche Töne automatisch zusammengelegt, ein dreifarbiges Logo bleibt also dreifarbig, auch wenn der Regler mehr erlaubt. Verschwindet eine echte Farbe, etwa ein dünner grauer Slogan, der die Farbe der Hauptmarke annimmt, erhöhe die Farben.

Detail bestimmt, wie klein ein Fleck sein darf, bevor er mit seiner Umgebung verschmilzt. Erhöhe es, wenn kleine Schrift zerfällt oder der Punkt auf dem i fehlt. Senke es, wenn ein JPG Sprenkel und lose Punkte um das Logo hinterlässt.

Glättung regelt, wie eng der Umriss den Pixeln folgt. Hohe Werte ergeben rundere Kurven und kleinere Dateien; niedrige Werte halten scharfe Ecken und feine Serifen. Rechte Winkel von Kästen und Buchstaben werden erkannt und bleiben bei jeder Einstellung scharf.

Jede Änderung aktualisiert das SVG im Nu. Unter der Vorschau siehst du die Größe des Originals neben der des SVG sowie die Zahl der Farben und Formen, so kannst du Einstellungen schnell vergleichen.

Ein JPG-Logo oder einen Scan bereinigen

Viele Logos gibt es nur noch als JPG von einer alten Website oder aus einer E-Mail-Signatur. Die JPG-Kompression hinterlässt schwache Flecken an den Kanten. Das Tool legt diese verstreuten Pixel mit der Nachbarfarbe zusammen, die Umrisse werden also sauber. Das Entfernen des weißen Hintergrunds klappt auch bei JPG: JPG kennt keine Transparenz, das SVG schon.

Für eine auf Papier fotografierte Unterschrift, eine gescannte Skizze oder einen Stempel nimmst du die Vorgabe Zeichnung. Sie trennt dunkle Tinte von hellem Papier, auch wenn das Papier etwas grau oder ungleichmäßig beleuchtet ist, behält die Tinte als eine einfarbige Form und entfernt alle weißen Flächen, auch das Innere der Buchstaben. Für die besten Kanten scannst du flach in hoher Auflösung oder fotografierst gerade von oben bei gleichmäßigem Licht.

Sehr kleine Bilder wie ein 64 Pixel großes Favicon werden vor dem Nachzeichnen intern vergrößert, das ergibt rundere Kurven. Details, die nicht in den Pixeln stecken, kommen aber nicht zurück. Ist die Schrift nur ein paar Pixel hoch, such zuerst nach einer größeren Kopie des Logos.

Das SVG prüfen und verwenden

Nutze die Zoomknöpfe über der Vorschau oder halte Strg gedrückt und dreh am Mausrad, um die Kanten bis zum 16-Fachen zu prüfen. Beide Ansichten zoomen und scrollen gemeinsam, du schaust also immer auf dieselbe Stelle. Zieh mit der Maus, um dich zu bewegen. Bei starkem Zoom wird das Original mit seinen echten Pixeln gezeigt, so siehst du den Unterschied sofort.

Das heruntergeladene SVG hat dieselbe Breite und Höhe wie dein Bild und enthält eine Form pro Farbe, ohne Skripte, Links oder eingebettete Bilder. Es öffnet sich in Browsern, Inkscape, Illustrator, Figma, Affinity Designer, Canva und den meisten Programmen für Schneideplotter. Um das Logo umzufärben, änderst du den Füllwert einer Form. SVG-Code kopieren legt den Code in die Zwischenablage, praktisch, um ihn direkt in eine Webseite einzufügen.

Buchstaben werden zu Umrissen, nicht zu bearbeitbarem Text. Musst du den Wortlaut ändern, tipp ihn in deinem Designprogramm mit der Originalschrift neu.

Tipps für das beste Logo-SVG

• Fang mit der größten und schärfsten Version des Logos an, die du findest. Ein Screenshot des Logos auf einer Website ist oft besser als ein komprimierter E-Mail-Anhang.
• Frag zuerst beim Designer nach der Original-Vektordatei (AI, EPS, PDF oder SVG). Ein nachgezeichnetes Logo ist ein guter Ersatz, aber das Original ist immer exakt.
• Entferne Schatten und Glanzeffekte in der Vorlage, wenn du kannst. Flache Logos ergeben deutlich sauberere Formen.
• Prüf das SVG auf dunklem und hellem Hintergrund, bevor du es an eine Druckerei oder einen Schilderhersteller schickst.