comparison · tools

Seven blob generators compared

A side-by-side look at seven blob generators, recording only what each tool's page states about seeds, animation, gradients, patterns and code export.

Published September 18, 2026

There are more blob generators than there are reasons to need one, and most of them do a slightly different job. This piece compares seven of them, including ours, on the seven things people actually ask about before they pick one.

How this was put together

Each tool’s public page was read on 18 September 2026, and every cell in the table below reflects what that page states. Where a page does not mention a capability, the cell reads not stated. That is deliberate and it is not a criticism: a tool may well do something its landing page never mentions, and a page that says less is not a page describing a worse tool. If a feature matters to you, open the tool and check it rather than trusting a table.

The Blobs column is the exception, because it describes our own tool and we know what is in it.

The table

Two cells need a footnote. Super Designer’s image column is marked yes because its Type control lists an Image option. The CSS Generators seed column is marked yes because the tool exposes a Shape ID field; the page does not say whether that ID travels in the address bar.

Blobmaker

Blobmaker is the short path. The page describes two controls, complexity as the number of points and contrast as the difference between them, and a dice button you press until a shape appears that you like. From there you download the SVG or copy the code to the clipboard. There are Download, Copy code and Share buttons on the interface.

Nothing on the page mentions PNG output, gradients, patterns, image fills or animation. What it offers instead is the shortest distance between opening a tab and having an SVG, which is genuinely the right tool for a lot of afternoons.

MagicPattern blob generator

MagicPattern’s blob generator is the most feature-dense of the group as described. The page lists complexity, edge count and randomness as controls, and fills that include a solid color, a linear gradient and a radial gradient. It also describes filling a blob with a pattern from a built-in collection or with an image you upload.

Export is stated as SVG, PNG or JPG, with a CSS snippet available for developers. Gradient direction is not mentioned, so the table records it as not stated even though two gradient types are offered. The page notes that the generator can be used online at no cost, with paid plans for higher-resolution downloads without a watermark.

Super Designer blob generator

Super Designer frames the tool around a Type control with six options: Regular, Gradient, Stacked, Dual, Image and Scene. Alongside it are an Edges slider, a Smoothness slider, a Colors control and an Outline option. The Stacked and Dual types are the distinctive part, because they build compositions of several blobs rather than a single shape.

Export is described as an SVG file or the SVG code copied directly. PNG, animation, seeds and shareable URLs are not mentioned on the page. The Image type is why the image-clip cell reads yes.

fffuel ssshape

ssshape is the only tool in this group where you place the points yourself rather than asking for a random shape. The controls listed are the points, skew on both axes, overall opacity, tension, stroke width and a doubling option that draws a second copy of the shape.

Fills are solid, linear gradient, radial gradient or none, with a fill-opacity control, and the linear and radial gradients expose angle and radius parameters, which is why this is the only competing tool in the table with a stated gradient direction. Patterns are supported with a pattern color, a pattern angle and a pattern scale. Output is an SVG file or copied SVG code; PNG, animation and reproducible URLs are not mentioned.

Haikei

Haikei is a background generator with a blob generator inside it rather than a blob tool that grew. The page describes fifteen generators, among them Blob scene and Blob scatter, and the workflow it sets out is to adjust the settings, press a dice button for a new variant, apply your own colors and choose a canvas size from a list of common ones.

Export is stated as PNG and SVG, so that you can continue working on the background in a vector editor, a CMS or a codebase. Code export, animation, seeds and gradient direction are not mentioned on the page. If you want a whole background composition rather than one shape, this is the tool in this list built for that.

CSS Generators blob

CSS Generators takes a different route again: its output is CSS, not SVG. The controls are Granularity, Depth, Rotation and a Shape ID field, with a toggle between a filled blob and a border-only blob, and a Generate button. The code it produces uses clip-path: shape(), the newer CSS shape function, and there is a copy button for it.

The Shape ID field is a seed by another name, which is why that cell reads yes. Everything else in the table is not stated on the page. If you want a blob that lives entirely in a stylesheet with no markup at all, this is the one that does that by design.

Blobs

Ours is the tool this site is about, so here is what the column means in practice. Complexity runs from 3 to 20 nodes and Randomness from 2 to 9, and both sit on top of a seed, so any shape can be rebuilt exactly. Fills are solid color, a two-stop gradient with a direction in CSS degrees, a pattern, a clipped image, or outline only.

Exports are SVG, PNG at 512, 1024 and 2048 pixels, CSS clip-path, a React component and a Flutter CustomPainter. The animated blob generator morphs one path between two and eight shapes and writes the loop out as CSS @keyframes, as an SVG carrying SMIL, or as a GSAP tween. The gradient blob generator handles the two-stop fills and the angle. Every setting travels in the query string, so a URL is a complete description of a blob.

Which one to pick

If you need a shape in under a minute and nothing else, Blobmaker. If you want fills and raster export in one place, MagicPattern. If you want multi-blob compositions, Super Designer or Haikei. If you want to draw the shape by hand rather than roll for it, ssshape. If you want pure CSS with no SVG, CSS Generators.

If you want the shape to move, to be rebuilt from a link months later, or to arrive as React or Flutter code, that is the gap this tool was built for. Start at the generator or take something ready-made from the shapes gallery.

Related

• Three ways to animate a blob
• Gradient blob color pairs that work
• Shapes gallery
• Docs: HTML and CSS