Design & Assets

Blob Shape CSS Generator

Generate organic blob CSS shapes.

More Design & Assets

Input

Blob Shape CSS Generator

bloborganic shapecssbackground

Output

Blob Shape CSS Generator

.blob {
  width: 140px;
  height: 110px;
  background: linear-gradient(135deg, #38bdf8, #dbeafe);
  border-radius: 58% 42% 34% 66% / 44% 43% 57% 56%;
  box-shadow: 0 26px 48px color-mix(in srgb, #38bdf8 28%, transparent);
}

Live preview

Live canvas

Related tools

Dot Pattern CSS Generator

Generate dotted background CSS pattern.

Mesh Gradient CSS Generator

Generate mesh gradient background CSS.

CSS Gradient Generator

Generate a linear gradient and copy the CSS instantly.

Accordion CSS Generator

Generate accordion panel CSS.

Avatar Stack CSS Generator

Generate overlapping avatar stack CSS.

Baseline Grid Generator

Generate baseline grid specs and CSS for vertical rhythm.