SVG blob generator.
Make organic blob shapes from a seed, filled, outlined or layered, and copy them as SVG or a React component.
SVG blob generator.
Need the UI around it? With Pro, your AI agent builds the form, the result card and the rest of the page from a prompt.
Get ProHow it works
4 steps, no account. It runs in your browser and nothing is uploaded.
Pick the colors
Choose a color pair, or set the first and second colors yourself.
Shape it
Points for the number of lobes, randomness for how uneven it is, and a seed; Shuffle draws a new one.
Fill it
Solid, a gradient at any angle, or an outline of any width, alone or in up to four layers.
Copy or download
Copy SVG, JSX or CSS, or download an SVG, PNG or WebP at the size you set.
Related tools
More design tools. Every one free, in the browser.
Pricing
Build it with Pro
The tool is free. Pro adds 6,000+ blocks, premium templates and the MCP server, so your AI editor builds the product around it.
4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.
- Secure checkout via Stripe
- Code lives in your repo
- Keep what you've shipped if you cancel
- License terms
Questions and answers
Before you trust the result: what to know about the format, the limits, your data and the tools next to it.
A soft, irregular closed shape, the organic kind set behind a hero image, an avatar or a feature icon. Here it is points around a circle, each pulled in by a seeded amount and joined by one smooth curve, so it has no corners.
Points sets how many lobes the outline can have, from 3 to 12. Randomness sets how far each point may be pulled toward the center: 0 is a circle, 100 a deeply uneven shape.
More blobs of the same seed family, each smaller than the last, stacked from the outer one in. They blend from the first color to the second, as solid fills, as gradient fills that fade outward, or as outlines.
Yes. The shape comes from the seed: the same seed, points and randomness give the same blob on any computer. Shuffle picks a new seed; type a word to get its blob back.
Copy the SVG, a React component (JSX) or CSS with the SVG as a data URI. Download an SVG, or a PNG or WebP at 1×, 2× or 4× the size, with a transparent background.
No. Everything is made in your browser and nothing is uploaded.
No. The SVG blob generator is free and opens without a sign-in, an account or an install.
Closest to the SVG blob generator: SVG wave generator, SVG pattern generator, SVG to PNG converter, SVG editor. Each opens on its own page, free and in the browser.
The SVG blob generator is one of 11 in its group. The group's page, /tools/design, lists them all.
The tool is free. Its interface is built from shadcn.io's own components (Button, Input, Slider and the rest of the registry under /ui), which come in React, Vue, Svelte and Solid. Pro adds the blocks and templates for the product around it.
4.9 out of 5 from 150+ developers
Build the product around it
Every block, template and icon, installed by your AI agent in your theme. The tools stay free.
Get Pro