SVG Bilder erstellen

PDF herunterladen
unter Mitarbeit von wikiHow Staff

PDF herunterladen

Scalable Vector Graphics (SVG) ermöglichen interaktivere Elemente auf Webseiten, ohne zu viel Bandbreite in Anspruch zu nehmen, wie dies beispielsweise bei anderen Bildformaten wie JPEG oder GIF der Fall ist. Dadurch sind sie ideal fürs Webdesign. [1] Einige digitale Illustrationsprogramme wie beispielsweise Adobe Illustrator bieten SVG-Optionen und es gibt kostenlos zugängliche Webseiten zur Konvertierung von SVG-Dateien. In diesem wikiHow zeigen wir dir, wie du deine eigenen SVG-Bilder erstellst.

Methode 1
Methode 1 von 2:

Mit JPG to SVG Converter von Convertio

PDF herunterladen
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7a\/Create-Svg-Images-Step-1.jpg\/v4-460px-Create-Svg-Images-Step-1.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7a\/Create-Svg-Images-Step-1.jpg\/v4-728px-Create-Svg-Images-Step-1.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Öffne deinen Browser und gehe auf https://convertio.co/jpg-svg/ . Dies bringt dich auf die Seite "JPG to SVG Converter" von Convertio, welche kostenlos nutzbar ist.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/4\/48\/Create-Svg-Images-Step-2.jpg\/v4-460px-Create-Svg-Images-Step-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/4\/48\/Create-Svg-Images-Step-2.jpg\/v4-728px-Create-Svg-Images-Step-2.jpg","smallWidth":460,"smallHeight":347,"bigWidth":728,"bigHeight":549,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Oben im Converter-Menü solltest du eine rote Toolbar mit verschiedenen Quellen sehen, auf die du zugreifen kannst, um eine JPG-Datei zur Umwandlung ins Dateiformat SVG hochzuladen.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/14\/Create-Svg-Images-Step-3.jpg\/v4-460px-Create-Svg-Images-Step-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/14\/Create-Svg-Images-Step-3.jpg\/v4-728px-Create-Svg-Images-Step-3.jpg","smallWidth":460,"smallHeight":344,"bigWidth":728,"bigHeight":544,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Sobald du eine Quelle ausgewählt hast, sollte ein Dialogfenster mit der Bibliothek der Ordner auf deinem Computer eingeblendet werden. Navigiere von hier aus zum Ordner mit der Datei, die du umwandeln möchtest, und markiere sie.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7f\/Create-Svg-Images-Step-4.jpg\/v4-460px-Create-Svg-Images-Step-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7f\/Create-Svg-Images-Step-4.jpg\/v4-728px-Create-Svg-Images-Step-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Sobald die Datei hochgeladen wurde, wird rechts unten in der Menü-Anzeige ein roter Button eingeblendet. Dies startet die Konvertierung, was je nach Größe der Datei ein paar Minuten dauern kann.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b0\/Create-Svg-Images-Step-5.jpg\/v4-460px-Create-Svg-Images-Step-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b0\/Create-Svg-Images-Step-5.jpg\/v4-728px-Create-Svg-Images-Step-5.jpg","smallWidth":460,"smallHeight":347,"bigWidth":728,"bigHeight":549,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Sobald die Datei umgewandelt wurde, wird im Converter-Menü rechts neben dem Dateinamen ein blauer Button eingeblendet. Sobald du ihn angeklickt hast, wird das Bild als SVG-Datei auf deinen Computer heruntergeladen.
    Werbeanzeige
Methode 2
Methode 2 von 2:

Mit Adobe Illustrator

PDF herunterladen
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6c\/Create-Svg-Images-Step-6.jpg\/v4-460px-Create-Svg-Images-Step-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6c\/Create-Svg-Images-Step-6.jpg\/v4-728px-Create-Svg-Images-Step-6.jpg","smallWidth":460,"smallHeight":346,"bigWidth":728,"bigHeight":548,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Adobe Illustrator ist ein Grafikdesign-Programm, mit dem du mit verschiedenen Tools und Funktionen selbst Kunstwerke erstellen kannst.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/22\/Create-Svg-Images-Step-7.jpg\/v4-460px-Create-Svg-Images-Step-7.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/22\/Create-Svg-Images-Step-7.jpg\/v4-728px-Create-Svg-Images-Step-7.jpg","smallWidth":460,"smallHeight":348,"bigWidth":728,"bigHeight":550,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Wenn du Illustrator geöffnet hast, kannst du die Tools links auf dem Bildschirm auswählen, um mit dem Gestalten deines Bilds zu beginnen.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c7\/Create-Svg-Images-Step-8.jpg\/v4-460px-Create-Svg-Images-Step-8.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c7\/Create-Svg-Images-Step-8.jpg\/v4-728px-Create-Svg-Images-Step-8.jpg","smallWidth":460,"smallHeight":346,"bigWidth":728,"bigHeight":547,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Wenn du deinem Bild individuelle Effekte hinzufügen möchtest, kannst du eine Ebene auswählen und dann auf Effekt > SVG-Filter > SVG-Filter anwenden klicken. Klicke dann einfach auf den Button SVG-Filter bearbeiten , bearbeite den Standard-Code und klicke auf OK , um die SVG-Effekte zu speichern.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/f4\/Create-Svg-Images-Step-9.jpg\/v4-460px-Create-Svg-Images-Step-9.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/f4\/Create-Svg-Images-Step-9.jpg\/v4-728px-Create-Svg-Images-Step-9.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/e2\/Create-Svg-Images-Step-10.jpg\/v4-460px-Create-Svg-Images-Step-10.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/e2\/Create-Svg-Images-Step-10.jpg\/v4-728px-Create-Svg-Images-Step-10.jpg","smallWidth":460,"smallHeight":348,"bigWidth":728,"bigHeight":551,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Um deine SVG-Datei zur Ansicht und Nutzung außerhalb von Illustrator bereitzuhalten, musst du sie exportieren.
    • Du kannst auch auf Sichern als... gehen, auch wenn dies die Datei speichert, so dass sie nur in Illustrator betrachtet und bearbeitet werden kann.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/ab\/Create-Svg-Images-Step-11.jpg\/v4-460px-Create-Svg-Images-Step-11.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/ab\/Create-Svg-Images-Step-11.jpg\/v4-728px-Create-Svg-Images-Step-11.jpg","smallWidth":460,"smallHeight":344,"bigWidth":728,"bigHeight":545,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Dies blendet ein neues Menü ein, in dem du die Datei aus Illustrator in das Format deiner Wahl exportieren kannst.
    • Du kannst auch Für Bildschirme exportieren... auswählen, damit das SVG-Bild auf eine Art und Weise gesichert wird, die du auf iOS- oder Android-Geräten aufrufen kannst.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/94\/Create-Svg-Images-Step-12.jpg\/v4-460px-Create-Svg-Images-Step-12.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/94\/Create-Svg-Images-Step-12.jpg\/v4-728px-Create-Svg-Images-Step-12.jpg","smallWidth":460,"smallHeight":349,"bigWidth":728,"bigHeight":552,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Illustrator bietet dir verschiedene Dateitypen zur Auswahl, einschließlich "web-ready" SVG-Dateien.
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7d\/Create-Svg-Images-Step-13.jpg\/v4-460px-Create-Svg-Images-Step-13.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7d\/Create-Svg-Images-Step-13.jpg\/v4-728px-Create-Svg-Images-Step-13.jpg","smallWidth":460,"smallHeight":346,"bigWidth":728,"bigHeight":548,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Dein Bild ist jetzt als SVG-Datei nutzbar.
    Werbeanzeige

Verwandte wikiHows

Die Hintergrundfarbe in Adobe Illustrator ändern
Hast du ein schiefes Lächeln? Hier findest du Tipps, was du dagegen tun kannst
Schriftarten zu Illustrator hinzufügen
Mit MS Paint Farben umkehren
Einen Listenpunkt in Photoshop einfügen
Mit GIMP ein transparentes Bild erstellen
Einen Kreis mit Grafik Software in sechs gleiche Teile aufteilen
Einen Hintergrund mit Photoshop Elements entfernen
Transparenz in Photoshop einfügen
Eine Collage machen
In Illustrator zuschneiden
Die Hintergrundfarbe in Photoshop ändern
Werbeanzeige

Referenzen

  1. ↑ https://helpx.adobe.com/illustrator/using/svg.html

Über dieses wikiHow

In anderen Sprachen
Diese Seite wurde bisher 6.837 mal abgerufen.

War dieser Artikel hilfreich?

Werbeanzeige