Menu

Beta
Sign in
Beta
Side Blob SVG element, flat

Side Blob SVG element, flat

A rounded shape enters from the left edge while the rest of its outline remains visible. Use it beside a sidebar heading on a website or along a brochure margin.

Free · from Blob Elements, Flat · Set 2

Similar SVGs

More from Blob Elements, Flat · Set 2

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/IHO-BoTBjZzA/amnt.svg" alt="Side Blob" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="teal" data-name="Teal"><path d="M0 642c29 1 58-8 87-13 79-13 153-6 209 59 63 76 90 164 210 170 72 4 133-27 181-80 19-21 37-42 60-58 22-17 47-29 70-44 60-37 101-98 94-170-7-66-48-115-102-149-26-16-54-30-75-55-22-26-27-58-41-89-26-61-91-96-156-93-117 5-155 112-264 116-112 4-174-110-273-106z" fill="#07aea1" stroke="#07aea1"/></g><g id="pine" data-name="Pine"><path d="M0 130c99-4 161 110 273 106 109-4 147-111 264-116 65-3 130 32 156 93 14 31 19 63 41 89 21 25 49 39 75 55 54 34 95 83 102 149 7 72-34 133-94 170-23 15-48 27-70 44-23 16-41 37-60 58-48 53-109 84-181 80-120-6-147-94-210-170-56-65-130-72-209-59-29 5-58 14-87 13v12c26 1 54-7 80-12 88-16 157-10 215 64 15 19 28 40 42 60 44 62 101 104 181 104 67 0 128-30 173-79 22-23 42-47 68-66 22-16 46-27 69-42 62-40 100-103 95-177-4-71-53-124-110-160-24-15-49-27-68-49-23-25-27-58-41-88-27-62-90-99-157-101-127-3-161 106-269 116-77 7-124-46-185-79-30-16-60-23-93-27z" fill="#053334" stroke="#053334"/></g></svg>
CSS background-image
.side-blob {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/IHO-BoTBjZzA/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.side-blob {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/IHO-BoTBjZzA/amnt.svg") center / contain no-repeat;
}
React
import SideBlobSvg from "./side-blob.jsx"; // from the React tab above

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

Tags

blobsideedgedecorationblobselementflat

Made with AMNT

AMNT Draw 1.2 drew this from the words Side Blob: Draw a rounded organic shape entering from the left edge, with its other edges fully visible. A flat element. as part of the pack Blob Elements, Flat · Set 2. 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