Blob SVG. Gen-Z ยท neumorphism ยท landing-page trend.
๐Ÿซง Preview (Regenerate = new shape)

How to use

  1. Adjust points (3โ€“20) and randomness.
  2. Pick gradient or solid color.
  3. Set both colors โ€” smooth interpolation auto.
  4. Rotate / resize as needed.
  5. Use "Regenerate" for infinite variants, then download SVG/PNG.

Key features

  • 3โ€“20 points, 0โ€“80% randomness
  • Linear gradient or solid
  • 5 presets (pink/cyan/yellow/green/dark)
  • Regenerate for infinite variants
  • SVG/PNG, transparent background

Use cases

  • Landing-page backgrounds โ€” Gen-Z appeal
  • Social profile backgrounds โ€” soft impression
  • App screens โ€” behind neumorphism cards
  • Slide decks โ€” escape the rectangle
  • Logo backgrounds โ€” accent organic shapes

What is a blob?

Blobs are irregular rounded shapes with no straight lines โ€” organic, soft, friendly. A core 2020s design trend used by Apple, Stripe, Linear, and Notion on landing pages. Contrasts with rigid rectangles, grabs attention, feels Gen-Z-friendly.

FAQ

Different shape each time?

Intentional randomness โ€” point positions vary so the same settings produce different blobs. Click "Regenerate" until you like the result.

Use as CSS clip-path?

Yes โ€” take the SVG path d value and use `clip-path: path('M ...')` in CSS.

Overlap multiple blobs?

Download several SVGs and layer them in Figma/Illustrator, or use PNG layers in Photoshop.

Free?

Yes, no signup.