Menu

Beta
Sign in
Beta
Asymmetric Blob SVG element, flat

Asymmetric Blob SVG element, flat

One large bulge tapers toward a narrower opposing end. The shape can anchor a magazine sidebar or add an uneven backdrop to a presentation title.

Free · from Blob Elements, Flat

Similar SVGs

More from Blob Elements, Flat

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/WV_HDYBYg_kK/amnt.svg" alt="Asymmetric Blob" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="currentColor"><path d="M159 29C179 40 190 61 188 83C187 105 171 119 151 128C137 135 128 145 123 161C118 178 104 190 85 188C67 187 61 174 55 158C49 144 38 138 26 126C13 113 9 95 15 78C21 60 38 55 53 48C70 41 78 25 96 17C117 8 141 18 159 29Z"/></svg>
CSS background-image
.asymmetric-blob {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/WV_HDYBYg_kK/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.asymmetric-blob {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/WV_HDYBYg_kK/amnt.svg") center / contain no-repeat;
}
React
import AsymmetricBlobSvg from "./asymmetric-blob.jsx"; // from the React tab above

<AsymmetricBlobSvg width={48} height={48} />

Tags

asymmetricblobirregularshapeblobselementflat

Made with AMNT

AMNT SVG 1.1 drew this from the words Asymmetric Blob: Draw an uneven filled shape with one large bulge and a narrower opposing end. as part of the pack Blob Elements, Flat. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings