JSFiddle - React, Tailwind, and code Playground

by Aaron von Schassen

HTML

<div class="wrapper">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

CSS

.wrapper {
  display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    grid-gap: 5px;
    width: 178px;
    transform: rotate(45deg);
}

.wrapper > div {
  background: black;
  padding: 3px;
  height: 50px;
  width: 50px;
}