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.
September 18, 2026Blog
Notes on shapes that move.
Longer pieces on the parts of the tool that need more than a tooltip: animation methods and their browser support, color pairs that hold up behind text, and where a blob belongs in a layout.
Articles
animation · css
Three ways to animate a blob
CSS keyframes on the d property, an SMIL animate element, or a GSAP tween. What each one needs, which browsers run it, and the code for all three.
September 18, 2026layout · css
Six ways to use a blob in a landing page
Behind a headline, as an image mask, a section divider, a card accent, a background cluster or a loading indicator, with markup and matching presets.
September 18, 2026design · color
Backgrounds made of blurred blobs
Turning scattered blobs into a soft color field: palettes that survive blending, blur radius against canvas size, readable text, and SVG versus PNG.
September 18, 2026css · clip-path
clip-path: shape() versus path()
Two CSS functions draw the same blob outline. One takes pixels, the other takes percentages. The syntax, the browser support, and the @supports pattern.
September 18, 2026gradient · color
Eight gradient blob color pairs
Eight two-stop gradients with hex values and a suggested angle, how the angle maps to CSS degrees, and how to check contrast before putting text on top.
September 18, 2026svg · css
Section dividers that stretch
Building a wave divider from the SVG export: inline markup or a CSS background, preserveAspectRatio, matching the fill, stacking layers and flipping.
September 18, 2026