Beta

Layered Blobs SVG background, flat

Free
Layered Blobs SVG background, flat

Three offset, solid-colour blobs stack along the bottom edge, with each layer visible. They provide a base for a course cover or an event programme.

Sign in to download. Free SVGs are free with any account.

blobslayersstackedbackgroundflat

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/Wi8mWiABExtL/amnt.svg" alt="Layered Blobs" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 900" preserveAspectRatio="xMidYMid slice"><rect width="1600" height="900" fill="#F6F3EC"/><path d="M-100 690 C180 570 390 600 620 684 C860 772 1110 650 1340 668 C1470 677 1570 727 1700 755 L1700 900 L-100 900 Z" fill="#D7E1D5"/><path d="M-100 775 C170 704 350 714 565 770 C800 832 1020 735 1235 728 C1445 720 1590 790 1700 817 L1700 900 L-100 900 Z" fill="#AFC8BB"/><path d="M-100 846 C125 790 365 821 550 850 C770 885 940 811 1150 809 C1360 807 1530 858 1700 840 L1700 900 L-100 900 Z" fill="#789F91"/></svg>
CSS background-image
.layered-blobs {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/Wi8mWiABExtL/amnt.svg");
  background-size: contain;
}
React
import LayeredBlobsSvg from "./layered-blobs.jsx"; // from the React tab above

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

Made with AMNT

AMNT SVG 1.1 drew this from the words Layered Blobs: Three offset blobs stack along the bottom edge, each solid layer visible above the next. as part of the pack Blob Backgrounds, Flat. Want one like it? Make your own in the SVG studio.

Rest of Blob Backgrounds, Flat

Whole pack

Similar SVGs

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