Blocks SVG background, flat

Free

Preview on the whole page

Uneven rectangular blocks stack in the lower corners, revealing their tops and sides. This leaves space for text on a brochure cover or announcement graphic.

Fixed colourcurrentColor becomes your colour

Inline styleOne style attribute per shape

Minified

blocks stack rectangles background 3d flat

How to use it

HTML <img>

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/o7LgowJwhwYu/amnt.svg" alt="Blocks" 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="#E9EFEC"/><g><path d="M0 625L145 555L385 555L240 625Z" fill="#C8D8D2"/><path d="M0 625H240V900H0Z" fill="#789A95"/><path d="M240 625L385 555V900H240Z" fill="#557B79"/><path d="M0 760L95 710L280 710L185 760Z" fill="#D8E3DC"/><path d="M0 760H185V900H0Z" fill="#A9C1B8"/><path d="M185 760L280 710V900H185Z" fill="#789A95"/><path d="M275 795L350 758L475 758L400 795Z" fill="#C8D8D2"/><path d="M275 795H400V900H275Z" fill="#A9C1B8"/><path d="M400 795L475 758V900H400Z" fill="#557B79"/></g><g><path d="M1325 560L1410 515H1600V560L1515 605Z" fill="#D8E3DC"/><path d="M1325 560H1515V900H1325Z" fill="#A9C1B8"/><path d="M1515 605L1600 560V900H1515Z" fill="#557B79"/><path d="M1190 705L1280 655H1500L1410 705Z" fill="#C8D8D2"/><path d="M1190 705H1410V900H1190Z" fill="#789A95"/><path d="M1410 705L1500 655V900H1410Z" fill="#557B79"/><path d="M1450 790L1520 750H1600V790L1530 830Z" fill="#D8E3DC"/><path d="M1450 790H1530V900H1450Z" fill="#A9C1B8"/><path d="M1530 830L1600 790V900H1530Z" fill="#789A95"/></g></svg>

CSS background-image

.blocks {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/o7LgowJwhwYu/amnt.svg");
  background-size: contain;
}

React

import BlocksSvg from "./blocks.jsx"; // from the React tab above

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

Made with AMNT

AMNT SVG 1.1 drew this from the words Blocks: Uneven rectangular blocks stack in the lower corners, with visible tops and side faces. as part of the pack 3D Backgrounds, Flat. Want one like it? Make your own in the SVG studio.

Rest of 3D 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