JSFiddle - React, Tailwind, and code Playground

by Brock Callahan

HTML

<h1>Blues</h1>
<main id="colors">
  <div>#66c8eb</div>
  <div>#15a0de</div>
  <div>#4a90e2</div>
  <div></div>
  <div></div>
  <div></div>
</main>

SCSS

#colors {
  display: flex;
  flex-wrap: wrap;
}
div {
  height: 150px;
  width: 150px;
  margin: 10px;
  border: 1px solid;
  &:nth-child(1) {
    background-color: #66c8eb;
  }
  &:nth-child(2) {
    background-color: #15a0de;
  }
  &:nth-child(3) {
    background-color: #4a90e2;
  }
}