Colours and style

Every picture in the library follows these, and so does every download.

Colour of single-colour icons
Palette for colourful pictures
As drawn
100%
Overlapping Squares SVG logo, flat

Overlapping Squares SVG logo, flat

Two offset solid squares in contrasting colours show a clearly shared area. They can illustrate common responsibilities in a team chart or layered elements in a design lesson.

Similar SVGs

More from Abstract Marks, Flat · Set 2

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/XrgeIogIE_an/amnt.svg" alt="Overlapping Squares" 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="violet" data-name="Violet"><path d="M384 638l1-282h255c0-53-1-107-1-159 0-19 3-37-1-56-28-3-57 0-85 0-55 0-108-1-163-1-84 0-168 1-252 1v496c22 5 50 1 74 1 57 0 115 0 172 0z" fill="#0136d6" stroke="#0136d6"/></g><g id="orange" data-name="Orange"><path d="M384 638c0 44 1 88 1 131 0 25-6 59 1 83h500v-496h-246v282z" fill="#fd6f02" stroke="#fd6f02"/></g><g id="purple" data-name="Purple"><path d="M384 638h256v-282h-255z" fill="#7b15d1" stroke="#7b15d1"/></g></svg>
CSS background-image
.overlapping-squares {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/XrgeIogIE_an/amnt.svg");
  background-size: contain;
}
React
import OverlappingSquaresSvg from "./overlapping-squares.jsx"; // from the React tab above

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

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Overlapping Squares: Two offset solid squares in contrasting colours, with their shared area clearly visible. A flat logo mark. as part of the pack Abstract Marks, 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