Menu

Beta
Sign in
Beta
Squares SVG pattern, flat

Squares SVG pattern, flat

Squares of two sizes alternate in offset rows, with space between each block. The pattern fits a presentation title slide or a printed folder.

Free · from Retro Patterns, Flat

Similar SVGs

More from Retro Patterns, Flat

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/vwCG0IiaTJb3/amnt.svg" alt="Squares" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><rect width="200" height="200" fill="#F5F0E6"/><g fill="#345C68"><rect x="18" y="18" width="30" height="30"/><rect x="82" y="18" width="30" height="30"/><rect x="146" y="18" width="30" height="30"/><rect x="50" y="118" width="30" height="30"/><rect x="114" y="118" width="30" height="30"/><rect x="178" y="118" width="30" height="30"/><rect x="-22" y="118" width="30" height="30"/></g><g fill="#E6A66B"><rect x="54" y="72" width="16" height="16"/><rect x="118" y="72" width="16" height="16"/><rect x="182" y="72" width="16" height="16"/><rect x="22" y="172" width="16" height="16"/><rect x="86" y="172" width="16" height="16"/><rect x="150" y="172" width="16" height="16"/></g></svg>
CSS background-image
.squares {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/vwCG0IiaTJb3/amnt.svg");
  background-size: 200px 200px;
}
React
import SquaresSvg from "./squares.jsx"; // from the React tab above

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

Tags

squaresblocksgeometricgridretropatternflat

Made with AMNT

AMNT SVG 1.1 drew this from the words Squares: Separated squares of two sizes alternate in offset rows. as part of the pack Retro Patterns, Flat. 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