SVG-Blob-Generator
Der SVG Blob Generator erstellt zufällige organische Blob-Formen aus glatten kubischen Bézierkurven – mit Reglern für Komplexität, Zufälligkeit, Größe, Füllfarbe und optionalem Verlauf – und exportiert den SVG-Code oder die Datei.
Über dieses Tool
Der SVG Blob Generator erstellt zufällige organische Blob-Formen aus glatten kubischen Bézierkurven – mit Reglern für Komplexität, Zufälligkeit, Größe, Füllfarbe und optionalem Verlauf – und exportiert den SVG-Code oder die Datei.
So funktioniert’s
- Lege Komplexität (Anzahl der Punkte) und Zufälligkeit fest.
- Wähle Größe und Füllfarbe oder aktiviere einen Verlauf.
- Klicke auf „Neu generieren“, bis dir die Form gefällt.
- Kopiere den SVG-Code oder lade die .svg-Datei herunter.
Gut zu wissen
- Jeder Blob ist ein einzelner SVG-Pfad aus Punkten rund um einen Kreis, verbunden mit kubischen Bézierkurven.
- Mehr Punkte ergeben eine komplexere Kontur; mehr Zufälligkeit macht sie weniger kreisförmig.
- SVG-Blobs bleiben in jeder Größe scharf und sind nur wenige hundert Bytes groß.
- Blobs sind beliebt als Hintergrunddekoration, Avatar-Rahmen und Abschnittstrenner.
- Das SVG lässt sich inline, als img-Quelle oder als CSS-Hintergrund verwenden.
Läuft komplett in deinem Browser – nichts, was du eingibst, wird hochgeladen oder gespeichert.
Häufige Fragen
Wie erstelle ich eine Blob-Form?
Passe hier Komplexität und Zufälligkeit an und klicke auf „Neu generieren“; jeder Klick zeichnet eine neue zufällige organische Form, die du als SVG herunterladen kannst.
Darf ich die Blobs kommerziell nutzen?
Ja. Die Formen werden zufällig auf deinem Gerät erzeugt, du kannst sie also in jedem Projekt verwenden.
Wie verwende ich einen SVG-Blob als Hintergrund?
Speichere die Datei und binde sie mit background-image: url(blob.svg) ein, oder füge das SVG inline ein und positioniere es hinter deinem Inhalt.
Kann ich einen Blob animieren?
Ja – du kannst ihn mit CSS drehen oder skalieren oder mit SMIL oder JavaScript zwischen zwei Pfaden mit derselben Punktzahl morphen.