Menu

Beta
Sign in
Beta
Wide Blob SVG element, flat

Wide Blob SVG element, flat

This low, elongated shape has uneven rounded ends and a broad horizontal span. It can sit behind a page heading or highlight a date on an event schedule.

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/YNy7o7iQOLGh/amnt.svg" alt="Wide 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="petrol" data-name="Petrol"><path d="M228 355c-79 4-176 57-174 147 2 94 113 130 190 132 50 1 97-15 146-26 44-10 90-13 135-11 96 5 186 43 283 35 73-7 192-56 163-150-19-61-91-79-146-76-28 2-55 10-81 19-88 31-182 37-272 5-81-29-154-80-244-75z" fill="#025766" stroke="#025766"/></g><g id="midnight" data-name="Midnight"><path d="M240 346c-81 2-182 46-193 137-13 97 85 149 168 158 101 11 189-40 291-36 99 4 194 40 293 36 77-3 196-49 184-144-13-101-141-112-218-88-19 6-37 13-56 19-72 20-150 22-221-1-83-28-157-82-248-81zm-12 9c90-5 163 46 244 75 90 32 184 26 272-5 26-9 53-17 81-19 55-3 127 15 146 76 29 94-90 143-163 150-97 8-187-30-283-35-45-2-91 1-135 11-49 11-96 27-146 26-77-2-188-38-190-132-2-90 95-143 174-147z" fill="#09242d" stroke="#09242d"/></g></svg>
CSS background-image
.wide-blob {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/YNy7o7iQOLGh/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.wide-blob {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/YNy7o7iQOLGh/amnt.svg") center / contain no-repeat;
}
React
import WideBlobSvg from "./wide-blob.jsx"; // from the React tab above

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

Tags

wideblobhorizontalshapeblobselementflat

Made with AMNT

AMNT Draw 1.2 drew this from the words Wide Blob: Draw a low, elongated filled shape with uneven rounded ends. 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