SVG-Blob-Generator
Organische Blob-Formen erzeugen und als SVG speichern
- Dateien verlassen Ihr Gerät nicht
- Läuft im Browser
- Kostenlos, ohne Anmeldung, ohne Wasserzeichen
R oder Leertaste erzeugt einen neuen Blob.
So verwenden Sie: SVG-Blob-Generator
Erzeugen Sie zufällige organische Blob-Formen und exportieren Sie sie als SVG, PNG oder React-Komponente. Punkte, Kontrast, Ebenen, Verlaufsfüllung und Konturstil lassen sich anpassen, eine Morph-Animation ist optional. Jede Form entsteht aus einem Seed-Wert direkt in Ihrem Browser.
- 1
Klicken Sie auf „Neuer Blob“ oder drücken Sie R bzw. die Leertaste, bis Ihnen die Form gefällt. Frühere Formen bleiben unter „Letzte Blobs“.
- 2
Passen Sie unter „Form“ Komplexität, Kontrast, Größe und Ebenen an.
- 3
Wählen Sie unter „Farbe“ eine der Paletten oder eine einfarbige bzw. Verlaufsfüllung, und stellen Sie den Stil auf „Kontur“, wenn Sie nur den Rand möchten.
- 4
Legen Sie Breite und Höhe der Arbeitsfläche fest, schalten Sie bei Bedarf die Hintergrundfarbe ein und aktivieren Sie die Morph-Animation für eine bewegte Form.
- 5
Klicken Sie auf „SVG herunterladen“ oder wählen Sie die PNG-Skalierung 1×, 2× oder 4× und klicken Sie auf „PNG“. „SVG kopieren“ und „React kopieren“ legen den Code in die Zwischenablage.
Häufige Fragen
Kann ich denselben Blob später wieder erzeugen?
Ja. Die Form ergibt sich aus dem Seed: Gleicher Seed und gleiche Einstellungen liefern immer denselben Blob. Notieren Sie die Zahl und tragen Sie sie wieder unter „Seed“ ein.
Ist der Hintergrund transparent?
Ja, standardmäßig. Schalten Sie die Hintergrundfarbe nur ein, wenn die Fläche gefüllt sein soll.
Läuft die Animation auch in der exportierten Datei?
Die Morph-Animation nutzt das eingebaute animate-Element von SVG und läuft daher im SVG- und React-Export ohne zusätzliches CSS oder JavaScript. Das PNG ist immer ein Standbild.
Wie verwende ich den Blob in einem React-Projekt?
„React kopieren“ liefert eine Komponente, die das SVG zurückgibt und ihre Props an das svg-Element weiterreicht, sodass Sie className oder style setzen können.
Wird etwas hochgeladen?
Nein. Formen werden vollständig in Ihrem Browser berechnet und exportiert.